Discussion :

[thibane]

Bonjour à tous,

Je galère sur un problème de Drag and Drop avec les Sortable avec la librairie Scriptaculous.

J'ai découvert des choses intéressantes. Notamment que sur l'évènement onUpdate (resp onChange), on peut connaitre l'id du conteneur source (resp l'id de l'item qu'on est en train de dropper.

***********************************
ex1 :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
...
onUpdate: SortableLists.updated,
...
 
var SortableLists = {
 
...
 
updated: function (list) {
        alert(list.id); //affiche l'id de la liste d'ou vient l'item droppé
}
 
...
}

************************************
ex2 :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
var SortableLists = {
...
onChange : SortableLists.test,
...
test: function (element) {
        alert(element.id); //affiche l'id de l'item droppé
...
}

Mais ça l'affiche un nombre impressionnant de fois. Normal puisque l'évènement onChange intervient à chaque fois qu'il y a modification dans l'ordre d'une liste, c'est à dire énornément de fois lorsqu'on bouge d'une liste de 12 élément à une autre de 20éléments..

************************************

Je vous explique rapidement ce que je dois faire:

1) Je peux bouger un élément "li" ou "ul" d'une liste à une autre.
2) Quand je drag&drop un élemen ("li" ou "ul"), je dois enregistrer plusieurs informations (comme l'id de l'élément droppé, l'id du conteneur source, l'id du conteneur destination)(en les insérant dans un array par exemple) et ensuite, je dois toujours conserver l'élément droppé dans le conteneur source (la liste "ul" de départ donc) mais avec une couleur de fond différente, ce qui montrera que l'élément a bien été bougé qqpart. Cela implique donc bien que je sache d'une manière ou d'une autre l'id de l'élément que je bouge car j'en ai besoin à plusieurs reprises.
3) Enfin, quand l'utilisateur clique sur un bouton submit, je dois appeler plusieurs actions struts corresponsdant à toutes les entrées que j'aurai dans mon array. C'est à dire qu'à chaque fois que l'utilisateur bougera un élément qqpart, il y a une opération sur des tables à effectuer derrière, donc c'est de cette manière que j'ai choisi de traduire les opérations à effectuer en base : en stockant les informations dans un array que je devrai parser à la fin.

Ca parait peutetre méchant comme ça mais ça l'est pas.

J'arrive à insérer une ligne dans un array sur l'évènement onUpdate mais par contre, j'arrive pas à mettre dans cette ligne les informations qui m'intéressent, à savoir les id que je vous ai cités plus haut.

Quelqu'un peut me filer un coup de main?

[DoubleU]

De mémoire, le premier argument passé au callback sur onChange et onUpdate c'est l'élément droppé, donc tu peux récupérer son id.

Edit: arf, semblerait que pour onUpdate ca soit le container, j'ai rien dit donc. Faut que tu récupères l'élément bougé pendant le onChange alors.

[thibane]

Ok mais le problème c'est quand j'utilise onChange, je vais récupérer mon id 2500fois entre le moment ou clique sur mon item pour le bouger et le moment ou je le dépose dans un container.
J'ai un peu de mal à voir comment faire pour juste le récupérer une fois et lancer un traitement derrière en fait..

Suis-je clair..?

[DoubleU]

Tu le mets a chaque fois dans une variable globale que tu récupères sur le onUpdate, c'est pas très beau mais a défaut de mieux...

[thibane]

Clair qu'il doit y avoir moins violent mais ça a le mérite de débloquer mon dev et pour cela, je t'en remercie chaleureusement.

Je laisse volontairement le problème "non résolu" car si qqun trouve une explication claire qqpart sur le net, ça serait cool de la partager

[thibane]

Bonjour à tous.

J'arrive mntnt à récupérer l'id de l'élément que j'ai droppé ainsi que la liste de destination.
(je vous mets les solution en fin de journée)

Il ne me manque plus que l'id de la liste de départ!

Sur mon évènement onUpdate (qui prend en paramètre le sortable, lequel j'en sais rien (entre celui de départ ou d'arrivée..), j'ai une fonction qui récupère l'id du sortable passé en paramètre.
Ce qui est bizarre, c'est que l'id de la liste de départ change tout le temps.
-> Qd je déplace un élément de la liste 1 dans la liste 1, j'ai bien l'id de la liste 1
-> Qd je déplace un élément de la liste 2 dans la liste 2, j'ai bien l'id de la liste 2
-> Qd je déplace un élément de la liste 2 vers la liste 1, j'ai bien l'id de la liste 2
-> Et qd je déplace un élément de la liste 1 vers la liste 2, j'ai toujours l'id de la liste 2! A n'y rien comprendre!

J'ai vu que l'évènement onUpdate était appelé 2 fois, une fois pour chaque liste, celle de départ et d'arrivée.
Mais alors comment faire pour récupérer l'id de la liste de départ???