Dans la relappe JQuery / Jqueryui, j'essaie d'appeler un événement sur un élément après le tri. Ceci est probablement relativement simple à faire depuis que JQuery a de nombreuses façons de mettre en œuvre des rappels. P>
p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js" integrity="sha256-Bxxp5LTCU2v12w2d0kxKb0vt5F4EgtrzcJKJSR3Xxio=" crossorigin="anonymous"></script>
<div class="sortable">
<div>
<ul class="1">
<li>test 1</li>
<li>test 2</li>
</ul>
</div>
<div>
<ul class="2">
<li>test 3</li>
<li>test 4</li>
</ul>
</div>
</div>
<div class="sortable">
<div>
<ul class="3">
<li>test 7</li>
<li>test 8</li>
</ul>
</div>
<div>
<ul class="4">
<li>test 9</li>
<li>test 0</li>
</ul>
</div>
</div>4 Réponses :
La documentation pour les événements peut être trouvée ici: http://jqueryui.com/demos/sortable/ < / a>
Je suppose que vous voudriez utiliser le type ou l'événement modifier .
Une liste d'événements pour le plug-in jquery UI Soyable peut être trouvé ici: http: // jqueryui. com / démos / triables / # événements
Utilisez l'événement Cet événement est déclenché lors du tri
a arrêté.
dans votre exemple Stop du plug-in SDICABLE .
cela fonctionne presque, maintenant comment limiter ceci à un élément particulier
@ vol7ron, ui.item à l'intérieur de la fonction de rappel contient l'élément qui a été déplacé, alors peut-être que vous pouvez travailler avec cela. Qu'est-ce que vous voulez exactement limiter?
Je travaille sur centrage d'un dayspicker qui peut être traîné et abandonné. Utilisation du forumla: (dp.parent.width - dp.width) / 2 . Finalement, je comprendrai ce que les colonnes sont correctes pour redimensionner et quelles sont les mêmes que celles-ci justifiées. Il peut y avoir un moyen plus facile de le faire, mais je travaille avec une disposition multi-colonnes.
ui.item.find ('. 2') semble faire ce dont j'ai besoin pour Traversal, la fonction stop () fait aussi ce dont j'ai besoin. - Je sais juste à quel point cela va être inefficace, cependant.
Une autre question rapide: ui a-t-il un objet qui définit l'objet de destination? Exemple, j'ai deux '.sortable est ci-dessus. Y a-t-il un moyen de voir quel conteneur il a été abandonné?
@ Vol7ron, vous pouvez avoir la fonctionnalité opposée, vous pouvez utiliser la Recevoir: fonction (Evénement, UI) événement d'un élément dressé, puis vous avez accès à ui.sender
@Gaby, oui, j'espérais déclencher un événement sur une liste particulière lorsque quelque chose en est inséré. Quelque chose comme vérifie l'objet inséré et s'il est un élément particulier, effectuez une action.
$(function() {
$('#sortable').sortable( {
revert : true,
connectWith : ".sortable",
stop : function(event,ui){
//write ur function here
}
});
});