11550 sujets

JavaScript, DOM et API Web HTML5

[RESOLU] Document... a la valeur NULL ou n'est pas un objet

Bonjour tout le monde !

J'ai un petit souci avec un code Javascript.

Voici une version largement épurée de ce code :
<HTML>
  <HEAD>
    <SCRIPT>
      var nbpieces = 1;
      function add_piece()
      {
        //On cree une nouvelle ligne
        TR = document.createElement("tr");
  
        //On cree les nouvelles colonnes
        TD1 = document.createElement("td"); IP1 = document.createElement("input");
        IP1.setAttribute('name', 'reference[]'); IP1.setAttribute('size', '20');
        TD1.appendChild (IP1);
  
        // On assemble les cellules a la ligne
        TR.appendChild(TD1);
  
        // On assemble le corps du tableau au tableau
        document.getElementById ('pieces').getElementsByTagName('tbody')[0].appendChild (TR);
        document.forms['datacloture'].elements['reference[]'][nbpieces].focus();

        nbpieces += 1;
      }
    </SCRIPT>
  </HEAD>
  <BODY>
    <FORM name="datacloture">
      <TABLE id="pieces" border="1">
        <TBODY>
          <TR>
            <TD><INPUT name="reference[]"></TD>
          </TR>
        </TBODY>
      </TABLE>
      <A href="javascript:add_piece()">Ajouter une piece</A>
    </FORM>
  </BODY>
</HTML>



Lorsque je clique sur le lien :
- avec Firefox, aucun problème, le focus est bien mis sur le nouveau champ
- avec IE, pas de focus, mais une bien erreur : "document.forms.datacloture.elements.references[][...] a la valeur NULL ou n'est pas un objet


Après quelques tests, on dirait qu'IE n'apprécie pas trop l'élément créé dynamiquement. Pour s'en convaincre, on peut par exemple dupliquer le <TR> dans le code HTML, sans toucher à nbpieces : la première fois, le focus est bien mis, puis on retrouve l'erreur.


Quelqu'un aurait-il une idée pour contourner ce problème ? Smiley biggrin
Modifié par eldiablo (23 Nov 2006 - 10:01)
Salut mon pauvre vieux !

Dis-donc, c'est peut-être une erreur de recopie de ton code mais ceci me semble bizarre. Enfin pas catholique ou orthodoxe comme on veut :

document.forms['datacloture'].elements['reference[]'] nbpieces .focus();

Je veux parler de l'espace entre le ] et nbpieces. Ne manquerait-il pas un point ?
Non, c'est un bug du forum (enfin, à mon sens) qui a repéré un "smiley" de nom "nbpieces" dans mon bloc "CODE", et du coup ce que tu vois, c'est le ALT d'une image qui n'existe pas. Il faut lire cette ligne la comme étant
document.forms['datacloture'].elements['reference[]'][ nbpieces ].focus();
Salut,

Pourquoi n'écris-tu pas tout simplement
IP1.focus();
?

Sinon, IE ne semble en effet pas apprécier cette syntaxe. Tu peux sans doute esquiver ce problème en ajoutant des ids différents aux éléments générés.
Euh ... tout simplement parce que je suis un grand distrait et que je n'ai pas du tout pensé à ca Smiley rolleyes , et que j'ai l'art de toujours chercher midi à quatorze heures !

Mille mercis, cela marche superbement ainsi.
Pour ceux qui tenteraient de faire le même code, il me faut signaler que cela ne fonctionne hélas pas avec Internet Explorer, qui réclame une autre syntaxe que Firefox.

J'ai trouvé l'explication dans un sujet du mois de mai :

DIonTheDole a écrit :
Il semblerait que IE ne réponde pas au DOM pour ça, car Microsoft dit de faire :
var contenu = document.createElement("<INPUT TYPE='RADIO' NAME='RADIOTEST' VALUE='First Choice'>");

plutôt que :
var contenu = document.createElement("input");
contenu.setAttribute("type","radio");
contenu.setAttribute("name","optMahj0" );

Donc bien sûr ce qui ne marche pas sous FF.


Hélas, j'ai bien du opter pour cette façon de faire, vu que Firefox vide le contenu des cellules du tableau si j'utilise innerHTML Smiley bawling ...
Sujet clos
Aller à