Connaître le tab actif

*.Har(d)t · 10/03/2009, 18h43

Salut,

Je cherche à savoir comment connaître le tab actif dans un TabContainer avec Dojo.

Code :

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

1
2
3
4
5
<div dojoType="dijit.layout.TabContainer" region="center">
        <div dojoType="dojox.layout.ContentPane" id="bibliographie" title="Bibliographie">Essai 1</div>
        <div dojoType="dojox.layout.ContentPane" id="news" title="Actualité">Essai 2</div>
        <div dojoType="dojox.layout.ContentPane" id="synthese" title="Synthèse"></div>
    </div>

Voici mes tabs.

J'essaye au pif un truc du genre:

Code :

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

1
2
3
if( dojo.byId("bibliographie").isSelected ) {
//Code à effectuer
}

Mais le code n'est jamais exécuté, même si le tab en question est celui qui est sélectionné.

Des pistes ?

Merci,

**emmanuel.remy** · 10/03/2009, 19h19

Code :

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

1
2
3
 
var leContentPaneSelectionne = idDuTabContainer.selectedChildWidget;
...

ERE

*.Har(d)t · 12/03/2009, 18h14

Envoyé par emmanuel.remy

Code :

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

1
2
3
 
var leContentPaneSelectionne = idDuTabContainer.selectedChildWidget;
...

ERE

Merci pour la réponse.

J'ai ajouté un id au tabContainer, mais je ne parviens toujours pas à récupérer cette information.

La valeur retournée est "undefined".
D'après la doc, selectedChildWidget est utilisable sur les StackContainers et sur les classes descendantes (Tabcontainer en est certainement une étant donné ses caractéristiques, bien que je n'aie pas vérifié cela)

Donc il y a forcément quelque chose qui m'échappe...

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
<script type="dojo/method" event="onClick" args="item">
                        var strUrl = "";
                        alert(dojo.byId("onglets").selectedChildWidget);
 
</script>
<div dojoType="dijit.layout.TabContainer" region="center" id="onglets">
        <div dojoType="dojox.layout.ContentPane" id="bibliographie" title="Bibliographie">Essai 1</div>
        <div dojoType="dojox.layout.ContentPane" id="news" title="Actualité">Essai 2</div>
        <div dojoType="dojox.layout.ContentPane" id="synthese" title="Synthèse"></div>
    </div>

**emmanuel.remy** · 12/03/2009, 20h50

Essaie ainsi car selectedChildWidget n'est pas une propriété du DOM mais du widget dojo:

Code :

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

1
2
dijit.byId("onglets").selectedChildWidget

ERE

*.Har(d)t · 13/03/2009, 13h19

Merci Emmanuel,

Ca ne fonctionne pas, j'ai toujours de l'undefined.

Du coup j'ai testé avec un code tout bête, et là ça fonctionne, donc ta solution est la bonne:

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
<html>
<head>
<title>Dojo example</title>
<style type="text/css">
  @import "dojo/dojo-release-1.2.3/dijit/themes/nihilo/nihilo.css";
</style>
 
<script type="text/javascript" src="dojo/dojo-release-1.2.3/dojo/dojo.js" djConfig="parseOnLoad:true, isDebug: false"></script>
<script>
    dojo.require( "dijit.layout.TabContainer" );
    dojo.require( "dijit.layout.ContentPane" );
</script>
<body class="nihilo">
    <button dojoType="dijit.form.Button" id="bouton">Click
    <script type="dojo/method" event="onClick" args="item">
        alert(dijit.byId("onglets").selectedChildWidget);                    
    </script>
    </button>
<div dojoType="dijit.layout.TabContainer" id="onglets">
    <div dojoType="dijit.layout.ContentPane" id="tab1" title="tab1">1</div>
    <div dojoType="dijit.layout.ContentPane" id="tab2" title="tab2">2</div>
    <div dojoType="dijit.layout.ContentPane" id="tab3" title="tab3">3</div>
</div>
</body>
</html>

Je n'ai plus qu'à cherche ce qui ne va pas donc mon propre code.
Comme j'ai des containers qui s'imbriquent, et que leur contenu est passé par des href, je suppose qu'en fait le problème doit plutôt venir de là...

EDIT : Juste après avoir posté ce message, j'ai fait un test sous IE7 (d'habitude je suis sous Firefox3), et sous IE7, mon code fonctionne... mais pas sous Firefox...
En revanche, l'exemple ci-dessus fonctionne sous les 2 (quoique sous Firefox il ne m'affiche pas les tabs,

)

Bred, en 2009 on en est encore à faire du débugage pour chaque navigateur, ça me désole...

EDIT 2:
Juste après avoir édité ce message, j'ai retesté, et maintenant ça marche aussi sous Ffx...

Note pour plus tard : Dans des cas comme ça, penser à vider le cache

Ca me semble résolu, merci du coup de main !