2010-10-07 17 views
1

J'ai un élément draggableBesoin d'aide pour réactiver le faisant glisser d'un draggable

$(".element").draggable({ 
helper: "clone", 
revert: 'invalid', 
containment: '#parent', 
appendTo: '#parent' 
}); 

J'ai deux questions:

  1. Après cet élément est tombé, l'original obtient automatiquement désactivé . Un point d'ancrage proche est ajouté à l'élément abandonné. Au clic de cette 'fermeture' l'élément original devrait à nouveau être déplacé et devrait être retiré de la div "drop".

J'ai écrit un gestionnaire pour l'ancre près comme suit, il supprime l'élément du largable, mais il ne fait pas draggable aggain.

$('.cancel a',ui.helper).click(function() 
{ 
    $(ui.helper).remove(); 
    $(ui.draggable).draggable('enable'); 
}); 

Aidez-nous s'il vous plaît. Merci d'avance.

Répondre

1

La réponse au premier problème consiste à définir l'option désactivée de l'élément déplaçable comme false. Sur gestionnaire pour l'ancrage proche, activez l'objet déplaçable que vous voulez faire glisser. Par exemple,

$('.cancel a',ui.helper).click(function() 
    { 
     $(ui.helper).remove(); 
     $('#element').draggable('enable'); 
    }); 
0

Je suppose que vous avez désactivé le draggable dans l'événement Drop (?)
$(ui.draggable) était encore en contexte là. Toutefois, dans l'événement click, vous ne pouvez plus accéder à l'objet déplaçable et vous devez sélectionner l'élément que vous voulez déplacer directement. par exemple: $("#element").draggable("enable")

0

Je l'ai fait une chose semblable où je crée un tableau pour maintenir l'index de la chute draggable, comme ceci:

var $drop = $(selector for my droppable), 
    $drag = $(selector for my draggable), 
    dragged = []; 
$drop.droppable({ 
    drop: function (e, ui) { 
     var dragIndex = $drag.index(ui.draggable); 
     dragged[$drop.index($(this))] = dragIndex; 
    } 
}); 

Ensuite, pour réactiver la draggable dans votre fonction d'annulation, vous feriez quelque chose comme ceci:

$('.cancel a').click(function() { 
    var clickIndex = $(selector for droppable).index($(this).parent()), 
     whichDrag = dragged[clickIndex]; 
    $drag.eq(whichDrag).draggable("enable"); 
}); 

Je devine que l'élément qui est retourné par $(this).parent() correspond aux éléments de votre sélection pour le largable, sinon, vous devrez faire un autre traversal.

L'idée de base est de trouver l'index de l'élément déplacé, de le stocker dans le tableau dragged à la position égale à l'index de l'élément sur lequel il est déposé. Ensuite, lors de l'annulation, vous utilisez l'index de l'élément où le fichier déplaçable a été supprimé pour obtenir la valeur du tableau dragged qui correspond à la position déplaçable d'origine, puis l'activez.