Bonjour à tous...
je suis entrain de faire un Back Office, et j'ai besoin de faire plusieurs tris de listes séparées. Je suis pour l'instant entrain de faire des tests de Sortable avec JQuery et je suis face a quelques petites difficultés.
Je vous montre les bouts de codes nécessaire pour comprendre mon souci :
Code html :
Code javascript :
Maintenant le situations...
Situation 1 : 1 script et une liste : ça marche nickel !!
Situation 2 : 2 scripts et deux listes : ça marche mais les listes se mélange.
Situation 3 : Idem situation 2 + la restriction containement:'parent' alors la c'est le bug... les listes font un peu ce qu'elles veulent !!
je n'ai toujours pas de solution... ce que je n'arrive pas c'est a bloquer les éléments de la liste Une dans la liste Une et les éléments de la liste Deux dans la liste Deux... ça se mélange... Et JQuery n'est plus cohérent !!!
Avez vous déjà rencontré ce problème... Il y a visiblement quelque chose que je n'ai pas compris... (si vous connaissez une doc en français d'ailleurs...)
d'avance merci.
je suis entrain de faire un Back Office, et j'ai besoin de faire plusieurs tris de listes séparées. Je suis pour l'instant entrain de faire des tests de Sortable avec JQuery et je suis face a quelques petites difficultés.
Je vous montre les bouts de codes nécessaire pour comprendre mon souci :
Code html :
<ul id="sortlist_un" class="ul_style">
<li id="votre_id_1" class="item">item 1</li>
<li id="votre_id_2" class="item">item 2</li>
<li id="votre_id_3" class="item">item 3</li>
<li id="votre_id_4" class="item">item 4</li>
<li id="votre_id_5" class="item">item 5</li>
<li id="votre_id_6" class="item">item 6</li>
<li id="votre_id_7" class="item">item 7</li>
</ul>
<ul id="sortlist_deux" class="ul_style">
<li id="votre_id_1" class="item">item 1</li>
<li id="votre_id_2" class="item">item 2</li>
<li id="votre_id_3" class="item">item 3</li>
<li id="votre_id_4" class="item">item 4</li>
</ul>
Code javascript :
<script type="text/javascript">
$(document).ready(
function(){
$('#sortlist_un').Sortable({
accept : 'item',
axis: 'vertically',
opacity: 0.4,
containment : '#sortlist_un',
helperclass: 'sortHelper',
onchange : function (sorted) {
serial = $.SortSerialize('sortlist_un');
$.ajax({
url: 'set_position.php',
type: 'post',
data: serial.hash,
//complete: function(data){alert(serial.hash);},
success: function(feedback){ $('#data').html(feedback);},
error: function(){alert('Erreur lors du déplacement !');}
});
}
});
});
</script>
<script type="text/javascript">
$(document).ready(
function(){
$('#sortlist_deux').Sortable({
accept : 'item',
axis: 'vertically',
opacity: 0.4,
containment : '#sortlist_deux',
helperclass: 'sortHelper',
onchange : function (sorted) {
serial = $.SortSerialize('sortlist_deux');
$.ajax({
url: 'set_position.php',
type: 'post',
data: serial.hash,
//complete: function(data){alert(serial.hash);},
success: function(feedback){ $('#data').html(feedback);},
error: function(){alert('Erreur lors du déplacement !');}
});
}
});
});
</script>
Maintenant le situations...
Situation 1 : 1 script et une liste : ça marche nickel !!
Situation 2 : 2 scripts et deux listes : ça marche mais les listes se mélange.
Situation 3 : Idem situation 2 + la restriction containement:'parent' alors la c'est le bug... les listes font un peu ce qu'elles veulent !!
je n'ai toujours pas de solution... ce que je n'arrive pas c'est a bloquer les éléments de la liste Une dans la liste Une et les éléments de la liste Deux dans la liste Deux... ça se mélange... Et JQuery n'est plus cohérent !!!
Avez vous déjà rencontré ce problème... Il y a visiblement quelque chose que je n'ai pas compris... (si vous connaissez une doc en français d'ailleurs...)
d'avance merci.