[jQuery] Draggable isn't switched on in cloned div?
Hi everyone,
spent the whole day trying to locate the problem here, so I would
really appreciate any ideas you might have on this one:
We have several "modules" in some sort pool (actually called "pool")
and want to drag them into a selection box ("auswahl") where we change
the CSS class from "pool_modul" to "auswahl_modul". So we clone one
module-div and can drop it into the "semester"-box, works
beautifully. Depending on if it came from another "semester" or the
"pool" we change the CSS as I said, but the problem is the same: For
some reason, we cannot drag them around any more. Guess the module
isn't really set "draggable".
I can't really see a reason why this should be difficult. Any ideas
would be great, because I not much of an expert on this stuff.
Anyway, our code looks like this:
var drop_in_auswahl = function
(modul_id,modul_class,semester,ui_draggable,this_semester,ui_helper){
var this_copy = $(ui_draggable).clone(true);
var this_copy_class = $(this_copy).attr("class");
if (this_copy_class =="pool_modul ui-draggable"){
$(this_copy).attr("class","auswahl_modul");
}
var this_subsemester = $(this_semester).find("div.subsemester");
$(this_subsemester).append(this_copy);
// draggable (setting the following line to $
(".auswahl_modul").draggable and so on doesn't help...
$(".auswahl_modul ui-draggable").draggable({
revert : "invalid",
helper : "clone"
});
// ui_helper sowie ui_draggable sind versteckt
$(ui_helper).remove();
$(ui_draggable).hide();
}
-----------------
And this is the function that actually calls the above:
$(".semester").droppable({
hoverClass : 'drophover',
accept : '.pool_modul ,.auswahl_modul',
drop: function(event, ui){
var ui_draggable = $(ui.draggable);
var ui_helper = $(ui.helper);
var this_semester = $(this);
var semester = $(this).attr("id");
var modul_id = $(ui.draggable).attr("id");
var modul_class = $(ui.draggable).attr("class");
drop_in_auswahl
(modul_id,modul_class,semester,ui_draggable,this_semester,ui_helper);
}
});