Récupérer un objet pour modifier ses attributs

**vermine** · 28/01/2009, 11h00

Bonjour,

Je souhaite obtenir la main sur un objet dojo mais je ne parviens pas à le récupérer:

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
 
<input
 type = "text"
 name = "nom_blabla."
>
<dojo:AutoComplete 
 formId = "taskControl"
 textboxId = "nom_blabla."
 action = "url"
 name = "tag_dodo"
/>

J'ai essayé:

Code :

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

1
2
 var liste_dojo = document.getElementsByName("tag_dodo");
alert(liste_dojo.length);

mais il m'affiche "0" alors qu'il y a plusieurs "éléments" de ce type dans la page.

En fait, j'aimerais pouvoir modifier son textboxId et son action.

**emmanuel.remy** · 29/01/2009, 00h42

Salut,

Pas beaucoup d'information dans ton message...

Néanmoins, d'après ton code il me semble que tu dois manipuler une version 0.4 de Dojo, la version qui a été ensuite refondue (donc très peu de compatibilité) pour fournir les version actuelles.

Si c'est bien le cas, tu peux appeler la fonction:

Code :

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

1
2
3
4
 
var autoC= dojo.widget.byId("tag_dodo")
 
//si v0.9+: dijit.byId(...)

Ne pas oublier que même en v0.4 Dojo parse ses tags pour recréer et/ou substituer le DOM final; donc les document.getElementByTagsName sont difficilement utilisables (ce qui est un peu moins vrai des document.getElementById, même si dojo.byId est préférable)

Bon courage,

Emmanuel

PS: sauf à être sur un projet existant, passe à la 1.2...

**vermine** · 29/01/2009, 08h23

Merci pour ton aide.

Je ne sais pas pour la version. C'est du code de 2004. Je suppose que c'est la 0.4.
Ton code me renvoie un [object Object] mais uniquement si je lui mets un id. Or (à vérifier), je pense que je ne peux pas jouer avec les ids (tableau dynamique, risque de se retrouver avec plusieurs éléments ayant le même id). J'ai donc le nom comme moyen de reconnaissance, mais... le dojo.widget.getId() ne me ramène rien lorsque je le fait sur le nom.

Je n'ai pas la main sur tout le code malheureusement.

**emmanuel.remy** · 30/01/2009, 03h29

Je te conseille quand même de regarder si tu ne peux pas générer des id ...

D'ailleurs de mémoire la 0.4 dispose d'une fonction dojo.dom.getUniqueID.

Sinon je pense que ton problème d'utilisation de document.getElementsByName vient du fait que dojo refabrique son dom pour le widget et que tu n'es pas du tout assuré qu'il introduise un attribut "name" dans le dom du widget créé. Quand Dojo crée le widget il prend les attributs de ta balise originale (ici formId,textboxId ,action ,name ) et les injecte dans le widget sous la forme de propriétés si et seulement si ces propriétés existent dans le widget

Quelque chose comme:

Code :

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

1
2
3
4
5
6
7
8
9
 
     // si la propriété relative à l'attribut est définie
     if (widget[att]) {
        widget[att] = args[att];
     }
     else {
          //sinon on ne perd pas l'attribut mais il est stocké dans un objet extraArgs          
        widget.extraArgs[att] = args[att];
     }

Tu devrais donc pouvoir utiliser cette caractéristique pour réécrire la fonction getElementsByName; cela donnerait quelque chose du genre

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
 
   var elementsByName = function(widgetType, attribut) {
                         var widgets = dojo.widget.byType(widgetType);
                         return dojo.filter(widgets, function(w) {
                                                        return w.extraArgs['name'] &&
                                                                 w.extraArgs['name']==attribut
                                                 });
                                   }
   //puis...
   liste_dojo = elementsByName("AutoComplete","tag_dodo");

Bon courage pour la suite de ton dev...

Emmanuel

**vermine** · 30/01/2009, 08h46

Je n'ai pas essayé de générer un id. Je laisse ça à ma collègue qui tente de créer l'objet dojo:AutoComplete tandis que moi, je tente de récupérer un existant parmi d'autres.

Etrangement, je ne parviens pas à faire de dojo.filter() et encore moins de Array.filter() javascript.

Code :

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

1
2
3
4
 
var tableau_test = [1, 2, 3, 4];
var tableau_resultat = tableau_test.filter(function(item){ return item>1; });
alert(tableau_resultat.length);

A croire que mon code n'accepte pas les filter()...

**emmanuel.remy** · 30/01/2009, 13h28

Pour le filter c'est une methode qui est peut-être apparue avec la v0.9...

Désolé... En résumé cette méthode parcourt un tableau et le filtre avec la fonction fournie en paramètre : on garde l'élément si elle renvoie true.

Tu ne devrais pas avoir de mal à la refaire à peu près comme ça (t'as plus vite fait de la copier des sources de la 0.9 si tu es intéressé...):

Code :

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

1
2
3
4
5
6
7
8
9
 
 
function filter(tableau, /* fonction de filtre */ accept) {
     var ret = [];
     for (i=0; i<tableau.length; i++) {
         if (accept(tableau[i])) ret.push(tableau[i]);
     }
     return ret;
}

A suivre...

**vermine** · 30/01/2009, 14h35

Merci Emmanuel.

Grâce à tes explications, je suis parvenu à changer le name du tag dojo:Autocomplete.
La question de ce topic est donc résolue.

Malheureusement, mon problème initial persiste. Et là, peut-être n'est-ce plus de l'ordre des dojo.
Reprenons le code du premier message:

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
 
<tr id="ligne_modele">
<td>
   <input
      type = "text"
      name = "nom_blabla."
   >
   <dojo:AutoComplete 
      formId = "taskControl"
      textboxId = "nom_blabla."
      action = "url"
      name = "tag_dodo"
   />
</td>
</tr>

Je précise ici que c'est une ligne modèle. J'ai un tableau dynamique qui lors de chaque clic sur un bouton, va recopier la ligne modèle et l'afficher dans ma page (cloneNode de la ligne_modele). Il n'y a pas de soucis avec les éléments HTML, ils se recopient correctement et gardent leurs attributs. Par contre, je ne parviens pas à savoir si le tag dojo s'est bien recopié également. A priori, non, vu que les attributs définis ne réagissent pas.
Le cloneNode filtre-t-il les tags qui lui sont inconnus ? Si oui, que faire ? Sinon, serait-ce à cause du insertBefore qui devrait être un dojo.dom.insertBefore ?

**emmanuel.remy** · 31/01/2009, 00h54

Salut Vermine,

C'est le navigateur qui effectue le clonage de ta ligne, pas dojo. Moralité, les balises dojo ne sont pas parsées et ne remplissent pas leur rôle...

Il faut donc que tu appelles manuellement le parser après avoir cloné. Plus généralement toute création manuelle d'élément de type Dojo doit être parsé.

Code :

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

1
2
3
 
//moyennement sûr de cette ligne en 0.4,mais semble ok
dojo.hostenv.makeWidgets();

Emmanuel

**vermine** · 02/02/2009, 09h07

J'ai essayé sans succès. Mais je garde espoir. Avec une technique semblable, nous perdions nos styles et effets lors du clonage. Ma collègue avait trouvé la solution. Peut-être que maintenant, après le parsing, il nous suffira de récupérer nos styles et effets.
Réponse mardi, fin de matinée au plus tôt.

**emmanuel.remy** · 02/02/2009, 14h17

Salut,

Après avoir pu récupérer les sources de la 0.4, je peux te passer deux autres pistes:

Plutôt que cloner l'ensemble avec le tag Dojo, tu peux clôner l'aspect "template" et ensuite raccrocher un widget créé à la volée; cela évite alors de parser et règle le souci de l'id:

Code :

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

1
2
3
 
var newWidget = dojo.widget.createWidget("AutoComplete", {param1: value1, param2:value2});
noeud_d_insertion.addChild(newWidget);

Si tu clones l'ensemble avec le tag Dojo, tu dois regénérer un id et l'affecter (mais se pose alors le problème de la capacité du navigateur à ajouter un id après le chargement en mémoire - à vérifier) puis appeler:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
```
dojo.widget.byId(idGenere);
```
qui effectue basiquement un parse s'il n'a pas déjà été fait.

Mais ne jamais perdre de vu que le comportement du clônage ne dépend pas de Dojo mais du navigateur.

Emmanuel

**vermine** · 02/02/2009, 15h53

Je pense qu'on arrive aux limites de mes connaissances.

Code :

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

1
2
 
var newWidget = dojo.widget.createWidget("AutoComplete", {...});

Me renvoit "Bad srcObj for srcFunc: onkeypress".

Code :

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

1
2
 
var newWidget = dojo.widget.createWidget("UnAutreNom", {...});

Me renvoit "0 is null or not an object".
Mais... l'erreur n'est pas déclenchée à la même ligne et je ne parviens pas à retrouver les lignes (includes d'includes).

**emmanuel.remy** · 02/02/2009, 18h16

Bon pas trop grave tout ça ! Plutôt encourageant, même !

Comme le widget AutoComplete n'est pas intégré à dojo 0.4, j'ai fait une petite recherche sur le net et je l'ai trouvé dans un article java:
http://today.java.net/pub/a/today/20...-and-json.html

La lecture du source montre ceci:

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
 
//...
 
    this.widgetType = "AutoComplete";
 
    // Instance variables
    this.action = "";
    this.formId = "";
    this.textbox = {};
    this.textboxId = "";
    this.form = {};
 
    this.postCreate = function() {
 
        this.form = document.getElementById(this.formId);
        this.textbox = document.getElementById(this.textboxId);
        this.choices.style.width = this.textbox.style.width;
 
        dojo.event.connect(document, "onclick", this, "documentOnClick");
        dojo.event.connect(this.textbox, "onkeypress", this, "textboxOnKeyPress");
        dojo.event.connect(this.textbox, "onkeydown", this, "textboxOnKeyDown");
        dojo.event.connect(this.textbox, "onkeyup", this, "textboxOnKeyUp");
//...

En clair cela signifie que quand tu crées le widget, le paramètre textBoxId doit correspondre à l'id d'une textbox existante dans ton dom, car c'est sur elle qu'il connecte l'événement onkeypress.

Or ton message:

Me renvoit "Bad srcObj for srcFunc: onkeypress".

semble indiquer que Dojo ne peut effectuer cette connection de par l'absence d'un objet this.textbox correct.

A toi donc de faire en sorte que la textbox existe bien et dispose d'un id après ton clônage.

Dans un premier temps pour tester la faisabilité tu peux fournir pour chaque id celui d'une textbox que tu auras mis en dur. Tu pourras ajuster ensuite...

**vermine** · 03/02/2009, 08h41

La création du widget à l'air de fonctionner, en tout cas, il l'exécute sans broncher. Par contre, il bloque ici:

Code :

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

1
2
3
4
noeud_d_insertion.addChild(newWidget);

Object doesn't support this property or method.

J'ai essayé sur une <td> et un <input>.

**emmanuel.remy** · 03/02/2009, 11h11

Mille excuses... me suis emmêlé dans les méandres du DOM de Dojo et du DOM HTML...

Code :

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

1
2
3
4
 
//noeud_d_insertion ton noeud td ou div
 
noeud_d_insertion.appendChild(newWidget.domNode); //domNode est la racine DOM du widget une fois créé par Dojo

ERE