Bonjour, je ne trouve pas la solution au problème suivant, peut-être avez vous des pistes ?
J'ai une liste sortable composée d'objectifs.
On doit pouvoir dropper un objectif dans un autre objectif pour en faire un sous objectif.
Mais on ne doit pas pouvoir dropper un objectif qui contient des sous objectifs dans un objectif.
Cela veut dire que je doit gérer donc un tree avec un seul niveau d'arborescance.
Dans la piste que j'ai suivi tout fonctionne sauf que je n'arrive pas à interdire le drop d'un objectif avec sous objectifs dans un autre objectif quand celui ci a déjà des sous objectifs

Voici ce que j'ai fait :

Liste html
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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
 
<div id="rfo_boxeObjectifs" class="rfo_boxeObjectifs">
 
	<table class="rfo_mot_tableOi" id="rfo_mot_tableOi_1"> <---- ICI UN OBJECTIF
		<thead>
			[...]
		</thead>
		<tfoot>
		 [...]
		<tbody>
			<tr>
			 [...]
			</tr>
			<tr>
				<td class="SousObjectifs" colspan="5">sous objectifs ici</td> 
			</tr>
		</tbody>
	</table>		
 
	<table class="rfo_mot_tableOi" id="rfo_mot_tableOi_2"> <---- ICI UN OBJECTIF
		<thead>
			[...]
		</thead>
		<tfoot>
		 [...]
		<tbody>
			<tr>
			 [...]
			</tr>
			<tr>
				<td class="SousObjectifs" colspan="5">sous objectifs ici</td> 
			</tr>
		</tbody>
	</table>
 
	<table class="rfo_mot_tableOi" id="rfo_mot_tableOi_3"> <---- ICI UN OBJECTIF
		<thead>
			[...]
		</thead>
		<tfoot>
		 [...]
		<tbody>
			<tr>
			 [...]
			</tr>
			<tr>
				<td class="SousObjectifs" colspan="5">
						<table class="rfo_mot_tableOi" id="rfo_mot_tableOi_4"> <---- ICI UN SOUS OBJECTIF
								<thead>
									[...]
								</thead>
								<tfoot>
					 				[...]
								<tbody>
								<tr>
						 			[...]
								</tr>
								<tr>
									<td class="SousObjectifs" colspan="5">doit rester vide</td> 
								</tr>
						</tbody>
					</table>
				</td> 
			</tr>
		</tbody>
	</table>
</div>
Voici mes js
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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
 
function rfo_objectifs_intermediaires_setSortable () {
 
	// les élements qui vont être inclus dans le sortable
    // les objectifs et sous objectifs
    var arr = $$( 'td.SousObjectifs');
    var containments =arr.concat( $( 'rfo_boxeObjectifs'));
    // pour trier les objectifs
    Sortable.destroy('rfo_boxeObjectifs');
 
    Sortable.create('rfo_boxeObjectifs', {
    	tag :'table',
    	containment:containments
    	});
 
	// ici on va contrôler le tri
	// des sous objectifs
	$$('td.SousObjectifs').each(
			function(elem) {
				Sortable.destroy(elem);
				Sortable.create(elem,
						{tag:'table',
						 only:'rfo_mot_tableOi' }
                       );
             });
 
        // positionne le droppable sur les td qui doivent
        // contenir les sous objectifs
        // IMPORTANT : on ne peut pdéfinir en sous objectif
        // un objectif qui a déjà des sous objectifs
        $$('td.SousObjectifs').each(
                        function(elem) {
                                 Droppables.add(elem, {
                                            accept: 'rfo_mot_tableOi',
                                            hoverclass: 'SousObjectifsHover',
                                            onDrop:  function(e){DropHandler(e,elem);}
                                          });
                        });
 
 
}
 
function DropHandler( draggable,droparea){
        if (draggable.getElementsByTagName('table').length==0){ <-- LA SI IL Y A DES TABLE C'EST OBJECTIF AVEC SOUS OBJECTIFS
        	draggable.parentNode.removeChild(draggable);
            droparea.appendChild(draggable);
 
        }
    return true;
}
Donc ce que je fait :
Je met un sortable sur toutes les table de la div 'rfo_boxeObjectifs',
Je dit que que les destinations des drop (containment) ce sont 'rfo_boxeObjectifs' et les 'td.SousObjectifs'
J'ajoute un tri sur les sous objectif déjà présents
je rend droppables tous les 'td.SousObjectifs' pour essayer de contrôller ce que l'on dépose dedans avce la function DropHandler

Bon tout ceci fonctionne sauf pour un cas !!! et ce cas est justement mon problème !!!

Le contrôle du drop sur 'td.SousObjectifs' fait bien son boulot. Mais quand on drop dans 'td.SousObjectifs' et qu'il y déjà des sous objectifs le contrôle n'est pas effectué (c'est le sortable qui prend la main), donc on peut dans ce cas balancer dedans un objectifs avec des sous objectifs.

J'ai essayé avec onChange mais je ne sais pas comment je pourrait faire pour annuler le drop dans cet évènement.
Avez-vous des idées ?