à l'aide de jQueryUI sortable liste avec les formes
Je suis en utilisant jQueryUI pour créer une liste triable, et la partie de l'INTERFACE utilisateur fonctionne très bien à ce que je peux trier les éléments comme vous le souhaitez sur la page web. Je ne peux pas comprendre, même si, comment l'ordre de la liste triée est inclus dans le POSTE. Je suis un total noob avec le javascript, donc s'il vous plaît pardonnez-moi si c'est vraiment simple.
Voici les parties pertinentes de mon code html:
<script type="text/javascript">
google.load("jquery", "1");
google.load("jqueryui", "1");
function OnLoad(){
$( "#sortable" ).sortable({ axis: "y", containment: "#ballot", scroll: false });
$( "#sortable" ).disableSelection();
}
google.setOnLoadCallback(OnLoad);
</script>
[...]
<form method="POST" action="/vote">
<input type="hidden" name="key" value="{{ election.key }}">
<input type="hidden" name="uuid" value="{{ uuid }}">
<div id="ballot" class="center">
<ol id="sortable" class="rankings">
<li class="ranking">Jamie</li>
<li class="ranking">Joanie</li>
<li class="ranking">Morley</li>
<li class="ranking">Frank</li>
<li class="ranking">Larry</li>
</ol>
</div>
</form>
Comment pouvez-de l'ordre de Jamie, Joanie, Morley, Frank, et Larry être encodés dans le POST?
OriginalL'auteur Jeff O'Neill | 2011-02-27
Vous devez vous connecter pour publier un commentaire.
Vous pouvez utiliser la méthode
.serialize
sur votre sortable objet : http://docs.jquery.com/UI/Sortable#method-serialize$( "#sortable" ).sortable('serialize')
vous donnera un ajax submittable tableau d'éléments. Juste de l'attribuer à une zone de saisie si vous n'êtes pas à l'aide d'ajax. Ou tout simplement passer dans votre tableau de données, si l'utilisation d'ajaxMODIFIER
Exemple ici : http://jsfiddle.net/jomanlk/KeAer/2/
Jquery docs remarque, pour ce travail de vos éléments doivent avoir des identifiants de la forme de
set_number
(par exemple rank_1, rank_2). Donc j'ai modifié votre code HTMLIl suffit de retirer le
return false
dans la forme et le sérialisé valeur sera définie à la zone de saisie sur le formulaire de soumissionJ'ai édité ma réponse avec plus de détails sur l'utilisation et la un exemple. La bonne façon de l'utiliser est
$('.sel').sortable('serialize')
merci pour l'explication détaillée.
OriginalL'auteur JohnP