Discussion :

[laminfodev]

dojo.version 1.4
Bonjour tous le monde ,
je voudrais faire drag and drop entre les onglets et aussi dnd entre le contenu des onglet j'ai essai d'utiliser dojox.layout.GridContainer a l'interieur de dijit.layout.TabContainer
pour pouvoir fait dnd de toutes les balises qui sont a l'interieur de dojox.layout.GridContainer entre eux mais malheursement ca marche pas dnd et il m'affiche pas les onglets qui sont crees voila mon code si vous avez une idee pour le corriger ou si vous avez autre proposition pour faire ca je voudrais faire comme les envennement qui sont sur le site
www.netvibes.com par frameWork Dojo

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
<div dojoType="dijit.layout.TabContainer" style="width: 100%; height: 100%;">   
  <div id="GC1" dojoType="dojox.layout.GridContainer"
  nbZones="3"
  opacity="0.7"
  acceptTypes="dijit.layout.ContentPane">
 
        <div dojoType="dijit.layout.ContentPane" title="My first tab" selected="true">
            Lorem ipsum and all around...
        </div>
        <div dojoType="dijit.layout.ContentPane" title="My second tab">
            Lorem ipsum and all around - second...
        </div>
        <div dojoType="dijit.layout.ContentPane" title="My last tab" closable="true">
            Lorem ipsum and all around - last...
        </div>
 
  </div>
</div>

[laminfodev]

meme chose j'ai essai de les creer par js mais aussi il m'affiche rien protant dans le code source existe

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
 
   var monGrid = new dojox.layout.GridContainer(
            {
                nbZones: 1,
                opacity:0.7,
                allowAutoScroll:true
            },
            dojo.byId('monGrid')
        );
 
    var contentPane = new dijit.layout.ContentPane({}, dojo.byId('contentPane'));
    monGrid.addService(contentPane, 0, 1);
 
    var tc = new dijit.layout.TabContainer({
        //style: "height: 100%; width: 100%;",
        id:"tab1"
    },
    dojo.byId('contentPane'));
 
   var cp1 = new dijit.layout.ContentPane({
        title: "Food",
        id:"pane1",
        content: "We offer amazing food"
    });
    tc.addChild(cp1);
 
    tc.startup();
 
    monGrid.startup();

je voudrais savoir est qu'il ya un conflit entre tabContainer et gridContainer
merci pour votre reponse

[emmanuel.remy]

Salut,

J'ai un peu regardé et il ne semble pas exister de possibilité en standard pour faire du drag and drop d'onglets.

C'est vrai que ce serait une belle fonctionnalité.

ERE

[laminfodev]

merci emmanuel.remy pour votre reponse
je voudrais savoir je ne peux pas faire cette fonctionnalite par dojo ???????
vous avez pas une idee?

[emmanuel.remy]

Salut,

Impossible n'est pas français

Plus sérieusement on peut imaginer de gérer le dnd des onglets et ensuite d'intervertir les contentpane relatifs.
Il faudrait déjà:

1. tester l'échange de deux contentpane du container
2. tester l'échange de deux onglets (peut-être en changeant simplement leur libellé)
3. gérer le dnd

Suis prêt à t'aider pour tester ton code et debugguer si tu veux.

Bon courage,

ERE

[laminfodev]

merci beaucoup emmanuel.remy ;
j'ai essai d'integrer le code de drag and drop pour drager les contantPane ca marche juste dnd mais le probleme c'est que les onglets sont disparu , convertie a des div de typeDojo contentPane normal sans des onglets
voila mon code :

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
 <div style="width: 350px; height: 300px">
    <div dojoType="dijit.layout.TabContainer" style="width: 100%; height: 100%;">
    <div dojoType="dojo.dnd.Source" jsId="c3" class="dndContainer">
        <div dojoType="dijit.layout.ContentPane" title="My first tab" class="dojoDndItem" >
            Lorem ipsum and all around...
        </div>
        <div dojoType="dijit.layout.ContentPane" title="My second tab" class="dojoDndItem" >
            Lorem ipsum and all around - second...
        </div>
        <div dojoType="dijit.layout.ContentPane" title="My last tab" class="dojoDndItem" >
            Lorem ipsum and all around - last...
        </div>     
      </div>  
    </div>
 
</div>

merci d'avance

[emmanuel.remy]

Salut,

Tu peux poster le code complet de la page stp ? Ce sera plus simple pour tester de mon côté.

ERE