JQuery UI Drag and Drop - add random number -

i have drag , drop feature form. works great, having issues dateinput using datepicker. need make sure each datepicker element dropped has unique id. example of drag , drop

$(".component").draggable({     helper: function() {         return $(this).clone().addclass("component-drag");     } }).on("click", function() {     a.addcomponent($(this)); }),  $("#content").droppable({     accept: ".component",     hoverclass: "content-hover",     drop: function(b, c) {         a.addcomponent(c.draggable)     }    }) 

whatever happens, addcomponent function called once component has been dropped. @ moment, looks following

addcomponent: function(a) {     var input = a.find('input');     var = math.floor((math.random() * 1000) + 1);     if(input.attr('id') == 'dateinput') {         input.datepicker("destroy").removeclass('hasdatepicker');         input.attr("id",'dateinput' + i).datepicker();     }     a.clone().removeclass("component").addclass("element").removeattr("id").prepend('<div class="close">&times;</div>').appendto("#content"), $("#options_modal").modal("hide"); }, 

so check see if dragged component dateinput. if is, firstly destroy of original datepicker code. generate random number , add id attribute. kind of works, same number used dateinputs. if drag 2 dateinput elements, both still have same id.

i think need add id after clone, if do, nothing gets applied.

how go getting work? thanks

you can generate random id doesn't exist along following:

var inputs = $('#content').find('[id^=["dateinput"]'); var existing = inputs.map(function(i,input) {   return this.id.split('dateinput')[1]; }).get();  var random; {   random = math.random() * 1001; // n + 1 } while (array.indexof(random)>=0);  // use random generate id here