Discussion :

[Merfolk]

Bonjour


Mon but est de faire un drag & drop.
Pour cela il existe pleins de librairies, j'en ai testé 2-3, j'arrive à faire des choses. Mais quelque soit celle que j'utilise, je suis face à la même problématique : comment exploiter les id des éléments droppés....(D'ailleurs c'est une question plus générales, qui n'a même rien à voir avec le drag & drop finalement // mais qui me serait diablement utile.)
En quelques mots le code se resume souvent à ce principe, ceci quelque soit la librairie utilisée.

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
 
 
// les elements draggables
<div id="elementDraggable1">bblabalabl</div>
<div id="elementDraggable2">bblabalabl</div>
 
//et dun autre côté des zones droppables
<div id="zoneDrop1">bblabalabl</div>
 
// init du moteur de drag drop
Drag.add(elementDraggable1);
Drag.add(elementDraggable2);
Drop.add(zoneDrop1, functionQuiVaEtreAppelerQuandUnElementEstDroppeDessus);
 
 
// que fait cette fameuse fonction ?
function functionQuiVaEtreAppelerQuandUnElementEstDroppeDessus(IdelementDroppe)
{
   alert('IdelementDroppe a été drag-droppé ');
 
}

Ceci est fonctionnel.
Maintenant mon problème : Que faire de cet ID, comment l'exploiter....

Est-ce qu'il y a moyen en javascript de donner des attributs quelconques à une div ? (un tag personnalisé) ?

genre

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
 
<div id="draggable1"  attributs="categorie-5/compteur-10/produit-5050/idBdd-99555">Zone draggable1 </div>
 
 
function onDrop(idElementDroppe)
{
    // recuprer tous nos tags speciaux
     valeursPerso =  getElementbyId(idElementDroppe).getAttributs();
     data = fonction_genre_explode("/",valeursPerso );
 
     // puis là- avoir les attributs et en faire ce qu'on veut
     if (data[categorie] == "5")
         alert('cet element na pas le doit detre drag& droppé ici')
 
    if (data[categorie] == "4")
          Appeler_sauvegarder_base_de_donnees_ajax(data[produit],data[categorie],data[compteur])
 
    if (data[categorie == "2"])
 
     window.location = 'voir_profil_user.php?id=data[user]'
 
// etc    // etc    // etc.
 
 
}

voilà je pense que vous avez compris mon problème. Avec un id d'un composant html, ça ne m'avance pas trop....il me faut des id de base de données des objets déplacés

Est-ce possible ? Sinon comment faire de façon propre....
La seule solution que j'ai en tête pour l'instant c'est de faire

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
<div id="objetDraggale_JE CONCATENE_TOUTES_LESINFOS_LA_DEDANS">blablablaba</div>
 
function on drop(IdDroppe)
{
       numeroSerie = subString(idDroppé , 0 ,8 );
       autreInfos = subString(idDroppé,9,2 );
       EncoreUneAutreInfos = subString(idDroppé,12,6 );
 
      appeler script php  (numeroSerie ,autreInfos ,EncoreUneAutreInfos  )
 
}

Mais ça me semble très mauvais. Comment faire ?
Merci !

[E.Bzz]

Bonjour,

Mais ça me semble très mauvais.

pas tant que ça
Il suffit de t'assurer que l'ID reste bien unique.
Pour cela, il suffit que la "racine" ("objetDraggale" de ton exemple) le soit, au cas où les autres attributs puisse être identiques.
Sinon, pour rester "carré" (sans définir des attributs "perso" qui poseront peut-être des problème de compatibilité), tu peux stocker ces info dans des input type = "hidden" de ton div draggé. Tu pourras les récupérer sans ambigüité ...

A+