Faire div glisser après avoir été inséré à partir de la base de données

Question

Je me demandais si quelqu'un pouvait m'aider avec ce problème glisser/déposer jquery ui.

J'ai quelques divs draggable et droppable qui clone eux-mêmes quand ils sont traînés sur leur conteneur. Je sauve la position de la div dans une base de données, cependant si j'insère le même HTML dynamiquement et recharge la page le div n'est plus draggable, droppable etc.

Je comprends que c'est parce que le jQuery n'est plus lié à la div ...?

Donc, ma question, comment puis-je activer les div inséré dynamiquement pour être à nouveau draggable/droppable?

J'ai essayé d'implémenter LiveQuery mais je n'ai pas réussi à le faire fonctionner, comment utiliser .live?

Voici une URL à la page (lien mort a) tout le glisser/déposer, etc. JS est custom.js

Toute aide est vraiment apprécié

Un grand merci

EDIT: Quelqu'un a des idées? Je suis vraiment coincé sur celui-ci :(

Answer 1

vous avez juste besoin d'appeler draggable() sur les éléments qui sont dans votre arbre. Votre code existant déjà fait cela pour tous les articles ayant la classe drag.

À partir de votre code (« custom.js »):

//Make element draggable 
$(".drag").draggable(...); 

Cela n'affecte pas les éléments de votre arbre, parce qu'ils ne sont pas la classe drag Une solution facile serait d'ajouter simplement la classe drag à vos objets d'arbres. Alternativement, vous pouvez sélectionner spécifiquement vos éléments d'arbre en quelque sorte, puis appliquer draggable à t sélection de chapeau.