Discussion :

[tapoutapou]

J'ai un problème assez bizarre, parce qu'une manip qui marchait déjà sur une de mes pages ne marche plus.

Code :

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

1
2
3
4
5
6
7
 
for(l=1;l<=nbColonnes;l++){
	window["colonne"+l] = new dojo.dnd.Source("nodeA"+l, {accept: ["vehic"]});
}
 
colonne5.insertNodes(true, [link]);
colonne5.forInItems(function(item, id, map){dojo.addClass(id,"vehic");});

Comme vous l'aurez deviné, j'ai plusieurs colonnes, chacune source de dnd.
Je voudrais affecter un critère d'acceptation à chaque colonne. Mais quand je mets le code ci-dessus, plus aucune colonne n'accepte de drop venant d'autres colonnes.
Petite précision, les objets apparaissent bel et bien dans les colonnes, et quand j'enlève le {accept: ["vehic"]}., le drag'n'drop se réalise sans problème entre les différentes colonnes.

[emmanuel.remy]

Salut,

Reprends ton appel de forInItems car la signature que tu utilises est erronée: aucun id n'est passé.
Ensuite, fais attention car le accept ne fonctionne pas ainsi: il scrute le type de l'objet (text par défaut). C'est au moment où tu insères ton noeud que dojo va l'inspecter et chercher l'attribut dndType.

ERE

[tapoutapou]

J'ai un peu de mal à comprendre ce que tu dis . Tu pourrais re expliquer stp?

[tapoutapou]

Je me suis inspiré de ce site, et je ne vois pas de différence par rapport à ce que j'ai fait !?

[emmanuel.remy]

Salut,

Je me suis inspiré de ce site, et je ne vois pas de différence par rapport à ce que j'ai fait !?

Extrait du site:

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
var catalog = new dojo.dnd.Source("catalogNode", {
    accept: ["inStock,outOfStock"]
});
catalog.insertNodes(false, [
    { data: "Wrist watch",        type: ["inStock"] },
    { data: "Life jacket",        type: ["inStock"] },
    { data: "Toy bulldozer",      type: ["inStock"] },
    { data: "Vintage microphone", type: ["outOfStock"] },
    { data: "TIE fighter",        type: ["outOfStock"] },
    { data: "Apples",             type: ["inStock"] },
    { data: "Bananas",            type: ["inStock"] },
    { data: "Tomatoes",           type: ["outOfStock"] },
    { data: "Bread",              type: ["inStock"] }
]);
catalog.forInItems(function(item, id, map){
    // set up CSS classes for inStock and outOfStock
    dojo.addClass(id, item.type[0]);
});
 
var cart = new dojo.dnd.Source("cartNode", {
    accept: ["inStock"]
});
var wishlist = new dojo.dnd.Source("wishlistNode", {
    accept: ["inStock","outOfStock"]
});

dont un équivalent via les makup:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
    <ul dojoType="dojo.dnd.Source" accept="inStock,outOfStock"
        id="catalogNode" class="container">
        <li class="dojoDndItem inStock" dndType="inStock">Wrist watch</li>
        <li class="dojoDndItem inStock" dndType="inStock">Life jacket</li>
        <li class="dojoDndItem inStock" dndType="inStock">Toy bulldozer</li>
        <li class="dojoDndItem outOfStock" dndType="outOfStock">
          Vintage microphone</li>
        <li class="dojoDndItem outOfStock" dndType="outOfStock">TIE fighter</li>
        <li class="dojoDndItem inStock" dndType="inStock">Apples</li>
        <li class="dojoDndItem inStock" dndType="inStock">Bananas</li>
        <li class="dojoDndItem outOfStock" dndType="outOfStock">Tomatoes</li>
         <li class="dojoDndItem inStock" dndType="inStock">Bread</li>
    </ul>

Le accept ne se base pas sur une class mais sur un attribut dndType quand l'élément est parsé pr dojo (ce qui n'est pas ton cas ici) ou sur un attribut type quand tu utilises la fonction insertNodes.

C'était le sens de ma remarque initiale.

ERE

[tapoutapou]

En effet, je me rends compte qu'il y a même en commentaire que le code suivant ne permet que d'ajouter des classes CSS

Code :

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

1
2
3
4
5
 
catalog.forInItems(function(item, id, map){
    // set up CSS classes for inStock and outOfStock
    dojo.addClass(id, item.type[0]);
});

Mon problème est que toutes mes balises et tous mes objets avec lesquels je fais du drag'n'drop sont créés dans mon <script> et pas dans le <body>.
Comment pourrais-je ajouter un dndType par du <script>?

[tapoutapou]

Je viens de trouver le code suivant. Je vais le tester pour voir s'il marche:

Code :

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

1
2
 
monNoeud.setAttribute("dndType", "monType");

[tapoutapou]

Et hop, voici comment faire:

Code :

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

1
2
3
4
 
colonne5.forInItems(function(item,id,map){
   item.type = ["vehic"];
});

Merci pour ton aide ERE.

[emmanuel.remy]

Une chose à retenir c'est que si on fait des drag and drop de noeuds, Dojo en interne ne stocke pas les noeuds concernés, mais leur id, leurs types, et la donnée associée à transférer. D'où ton code final.

ERE