Bonjour à Tous,

J'ai une fonction récursive PHP qui parcourt une table SQL de catégories (id, parent_id, nom) pour afficher une arborescence.

Avec sortable, je voudrais pouvoir déplacer une sous-catégorie d'une catégorie à une autre, ou une catégorie dans une autre, bref, pouvoir réorganiser mon arbre à volonté.

Voici un exemple de l'affichage de l'organisation :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
<div id="cats">
 
<div class="column left" id="mere_1">
<ul class="sortable-list">
<li id="29" style="color:blue;font-weight:bold" class="sortable-item">Catégorie 1</li>
<li id="276"  class="sortable-item">Sous-Cat 1-1</li>
</ul>
</div>
<div class="column left" id="mere_2">
<ul class="sortable-list">
<li id="39" style="color:blue;font-weight:bold" class="sortable-item">Catégorie 2</li>
<li id="45"  class="sortable-item">Sous-Cat 2-1</li>
<li id="267"  class="sortable-item">Sous-Cat 2-2</li>
</ul>
</div>
<div class="column left" id="mere_3">
<ul class="sortable-list">
<li id="282" style="color:blue;font-weight:bold" class="sortable-item">Catégorie 3</li>
</ul></div>
 
</div>
et la fonction JQuery :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 
    $(document).ready(function () {
 
		$('#cats .sortable-list').sortable({
			connectWith: '#cats .sortable-list',
			placeholder : '.column left',
			update: function(e, ui){
 
				var objet_moved = $(ui.item); // L'élément déplacé
            	                var id_objet = objet_moved.attr('id'); // ID de l'élément déplacé
 
				var id_new = $('.column left').attr('id');
 
				$.ajax ( {
					url : "<?php echo $xhr; ?>",
					type : "post",
					data : "cat_bouge=" + id_objet + "&cat_recoit=" + id_new,
 
					success: function(data){alert(data);}
 
				});
 
			}
		});
 
    });
L'idée globale est que chaque <div> de classe "column left" affiche une catégorie et ses sous catégories, chacune dans un <li> avec son ID. Je voudrais pouvoir déplacer une sous-cat d'une catégorie à l'autre, ou une catégorie mère dans une autre, mais pas une sous-catégorie dans une autre sous-catégorie. Dans mon exemple, le alert me renvoie l'id de la catégorie/sous-cat qui est déplacée, mais le div "receveur" me renvoie undefined au lieu de "mere_1", par exemple.
Comment récupérer les deux à coup sûr et empêcher le déplacement d'une sous-cat dans une autre sous-cat ?
Merci de votre aide.