elements de formulaire au nom inconnu

elements de formulaire au nom inconnu - HTML/CSS - Programmation

Marsh Posté le 22-12-2003 à 18:17:34    

bonjour,
j'ai généré des eleemnts dans un formulaire a l'aide de php du style:
pour i de 0 à fin
<td><input type=text name=cbox[$i] D6D3CE' disabled onclick=func_able($i)></td>
<td><input type=text name=toto[$i] D6D3CE' disabled></td>
 
mon but c'est de rendre ces elements accessibles a l'aide d'un js. Mais apparement il ne reconnait pas  
document.form.element[i].disabled
c'est normal?

Reply

Marsh Posté le 22-12-2003 à 18:17:34   

Reply

Marsh Posté le 22-12-2003 à 21:28:22    

Ton HTML généré ressemble à quoi ?


---------------
mes programmes ·· les voitures dans les films ·· apprenez à écrire
Reply

Marsh Posté le 23-12-2003 à 11:25:25    

Il ressemble a ce que je veux!
 
pour i de 1 à n
<td><input type=text name=cbox[1] D6D3CE' disabled onclick=func_able(1)></td>
<td><input type=text name=toto[1] D6D3CE' disabled></td>
<td><input type=text name=cbox[2] D6D3CE' disabled onclick=func_able(2)></td>
<td><input type=text name=toto[2] D6D3CE' disabled></td>
...
<td><input type=text name=cbox[n] D6D3CE' disabled onclick=func_able(n)></td>
<td><input type=text name=toto[n] D6D3CE' disabled></td>
 
mais dans le js: if(document.form.cbox[0].disabled) y reconnait pas!?
 

Reply

Marsh Posté le 23-12-2003 à 11:53:34    

heu c'est quoi ces crochets, cette espace et cette apostrophe dans le nom :heink:
Puis en HTML faut mettre les valeurs des attributs entre guillemets ou apostrophes :o


Message édité par antp le 23-12-2003 à 11:54:56

---------------
mes programmes ·· les voitures dans les films ·· apprenez à écrire
Reply

Marsh Posté le 23-12-2003 à 12:05:49    

dsl un abbus de CtrlC CtrlV lol
qt au "" c'est pour pas avoir de pb avec php
en propre ca fait :
<td><input type=text name=cbox[1] disabled onclick=func_able(1)></td>
<td><input type=text name=toto[1] disabled></td>
<td><input type=text name=cbox[2] disabled onclick=func_able(2)></td>
<td><input type=text name=toto[2] disabled></td>
...
<td><input type=text name=cbox[n]  disabled onclick=func_able(n)></td>
<td><input type=text name=toto[n]  disabled></td>
 
le message d'erreur sur la ligne if(document.form.cbox[0].disabled) c qui dit document.form.cbox Null. Alors que c pas vrai!!! Mais j'ai l'impression qui bloque sur mes [].

Reply

Marsh Posté le 23-12-2003 à 12:08:54    

T'appelles ça propre ? [:ddr555]
 
Ces crochets dans le nom je ne vois pas comment ça peut marcher. cbox[0] = le premier element d'une liste appelée cbox
 
Et pour PHP, bah suffit de mettre des ' en HTML dans les chaînes " PHP, ou l'inverse. (ou mettre des \ devant les guillemets).


Message édité par antp le 23-12-2003 à 12:09:23

---------------
mes programmes ·· les voitures dans les films ·· apprenez à écrire
Reply

Marsh Posté le 23-12-2003 à 12:15:03    

Bon d'accord j'ai pas tendance a faire du propre mais la j'ai fait l'effort de joli \" partout et pourtant il n'obtient pas l'objet attendu

Reply

Marsh Posté le 23-12-2003 à 12:27:01    

Bon les crochet, ça sert à recevoir les données dans des tableaux en PHP !
 
Le problème n'est pas là. En JS, c'est l'ID qu'il faut utiliser, pas le NAME ! ! ! !
 
Ton HTML généré doit ressembler à ça :

Code :
  1. <td><input type="text" name="cbox[1]" id="cbox_1" disabled onclick="func_able(1);"></td>
  2. <td><input type="text" name="toto[1]" id="toto_1" disabled></td>
  3. <td><input type="text" name="cbox[2]" id="cbox_2" disabled onclick="func_able(2);"></td>
  4. <td><input type="text" name="toto[2]" id="toto_2" disabled></td>
  5. ...
  6. <td><input type="text" name="cbox[n]" id="cbox_n" disabled onclick="func_able(n);"></td>
  7. <td><input type="text" name="toto[n]" id="toto_n" disabled></td>


 
Avec les " et le ; pour le javascript dans les événements
 
En js, tu fait comme ça pour tester :
 

Code :
  1. function func_able( x )
  2. {
  3. if( document.getElementById( 'cbox_' + x ).disabled )
  4. {
  5.  ...
  6. }
  7. }


 
 
Je sais pas ce que tu veux en faire, mais il me semble que tu te fais chier Grâve...
M'enfin, c'est normal au début :D


---------------
Laissez l'Etat dans les toilettes où vous l'avez trouvé.
Reply

Marsh Posté le 23-12-2003 à 13:24:01    

Pas besoin d'id ; pour les forumulaires on peut accéder aux éléments via leur nom comme il le faisait...
mais comme je l'ai dit plusieurs fois (je parle dans le vide ?) des crochets dans les noms ça ne passera pas !


Message édité par antp le 23-12-2003 à 13:24:23

---------------
mes programmes ·· les voitures dans les films ·· apprenez à écrire
Reply

Marsh Posté le 23-12-2003 à 14:09:27    

Les crochet ça passe ! ! !
demo : http://www.surleau.org/test/demo.php
 
Et les IDs, c'est pas pour les chiens !
 
Surtout si tu ne numérote pas les [] :D
 
M'enfin ça marche avec document.form à condition d'avoir une form qui s'appelle form :D
 
Surtout, s'il met tout disabled, y'a aucune chance qu'un 'onclick' se déclanche :lol:


---------------
Laissez l'Etat dans les toilettes où vous l'avez trouvé.
Reply

Marsh Posté le 23-12-2003 à 14:09:27   

Reply

Marsh Posté le 23-12-2003 à 14:36:34    

mara's dad a écrit :

Les crochet ça passe ! ! !


ha tiens, j'aurai appris quelque chose :o


---------------
mes programmes ·· les voitures dans les films ·· apprenez à écrire
Reply

Marsh Posté le 23-12-2003 à 15:29:42    

Ben en fait, avec la syntaxe document.NomDuFormulaire.NomDuChamps y'a des problèmes.
D'ou l'utilisation de l'id et de document.getElementById('IdDuChamps') qui en plus d'être indépendante du formulaire est standard !
La syntaxe document.<form_name> ne fait pas partie du DOM.
En revanche document.forms est une collection qui elle fait partie du DOM. Idem pour elements qui est aussi une collection.
 
On peut donc aussi ecrire :

Code :
  1. function func_able( x, y )
  2.   {
  3.      if( document.forms[x].elements[y].disabled ) 
  4.      {
  5.         ...
  6.      }
  7.   }


 
M'enfin, je préfère les IDs ou même 'this'...


---------------
Laissez l'Etat dans les toilettes où vous l'avez trouvé.
Reply

Marsh Posté le 23-12-2003 à 15:33:38    

Un de mes exemples préférés :

Code :
  1. <html>
  2. <head>
  3. <script language="javascript">
  4. function suppr( myNode )
  5. {
  6. var curNode = myNode.parentNode.parentNode
  7. curNode.parentNode.removeChild( curNode );
  8. }
  9. function ins( myNode, aTemplate )
  10. {
  11. var curNode = myNode.parentNode.parentNode
  12. curNode.parentNode.insertBefore( newLine( aTemplate ), curNode );
  13. }
  14. function up( myNode )
  15. {
  16. var curNode = myNode.parentNode.parentNode
  17. var prevNode = curNode.previousSibling;
  18. if( prevNode )
  19. {
  20.  curNode.parentNode.insertBefore( curNode, prevNode );
  21. }
  22. }
  23. function down( myNode )
  24. {
  25. var curNode = myNode.parentNode.parentNode
  26. var nextNode = curNode.nextSibling;
  27. if( nextNode )
  28. {
  29.  curNode.parentNode.insertBefore( nextNode, curNode );
  30. }
  31. }
  33. function add( aTarget, aTemplate )
  34. {
  35. document.getElementById( aTarget ).appendChild( newLine( aTemplate ) );
  36. }
  38. function newLine( aTemplate )
  39. {
  40. var newTr = document.getElementById( aTemplate ).cloneNode( true );
  41. newTr.removeAttribute( 'id' );
  42. return newTr;
  43. }
  45. function init( aTarget, aTemplate )
  46. {
  47. if( ! document.getElementById( aTarget ).hasChildNodes() )
  48. {
  49.  add( aTarget, aTemplate );
  50. }
  51. }
  52. </script>
  53. </head>
  54. <body onload="init( 'tb', 'newLine' );init( 'tub', 'newYear' );">
  55. <form>
  56. <table>
  57. <thead>
  58.  <tr>
  59.   <th>Actions</td>
  60.   <th>Nom</th>
  61.   <th>Pr&eacute;nom</th>
  62.   <th>Adresse</th>
  63.   <th>Actions</td>
  64.  </tr>
  65. </thead>
  66. <tbody id="tb"></tbody>
  67. </table>
  68. <button type="button" onclick="add( 'tb', 'newLine' );">*</button>
  69. <table>
  70. <thead>
  71.  <tr>
  72.   <th>Actions</td>
  73.   <th>Ann&eacute;e</th>
  74.   <th>Classes</th>
  75.   <th>Actions</td>
  76.  </tr>
  77. </thead>
  78. <tbody id="tub"></tbody>
  79. </table>
  80. <button type="button" onclick="add( 'tub', 'newYear' );">*</button>
  81. <input type="submit">
  82. </form>
  83. <table style="display:none;">
  84. <tbody>
  85.  <tr id="newLine">
  86.   <td>
  87.    <button type="button" onClick="up( this )">&uarr;</button>
  88.    <button type="button" onClick="down( this )">&darr;</button>
  89.   </td>
  90.   <td>
  91.    <input type="text" name="Nom[]" value="">
  92.   </td>
  93.   <td>
  94.    <input type="text" name="Prenom[]" value="">
  95.   </td>
  96.   <td>
  97.    <input type="text" name="Adresse[]" value="">
  98.   </td>
  99.   <td>
  100.    <button type="button" onClick="ins( this, 'newLine' )">+</button>
  101.    <button type="button" onClick="suppr( this )">-</button>
  102.   </td>
  103.  </tr>
  104.  <tr id="newYear">
  105.   <td>
  106.    <button type="button" onClick="up( this )">&uarr;</button>
  107.    <button type="button" onClick="down( this )">&darr;</button>
  108.   </td>
  109.   <td>
  110.    <input type="text" name="Annee[]" value="">
  111.   </td>
  112.   <td>
  113.    <input type="text" name="Classe[]" value="">
  114.   </td>
  115.   <td>
  116.    <button type="button" onClick="ins( this, 'newYear' )">+</button>
  117.    <button type="button" onClick="suppr( this )">-</button>
  118.   </td>
  119.  </tr>
  120. </tbody>
  121. </table>
  122. </body>
  123. </html>


 
J'ai enlevé les commentaires, c'est plus drôle :D


---------------
Laissez l'Etat dans les toilettes où vous l'avez trouvé.
Reply

Marsh Posté le 23-12-2003 à 15:36:24    

waouhh,
on voit les pros!! Content de vous avoir appris et amusez à la fois c. Juste histoire d'apprendre un peu plus: faut voir les "name" comme des classes et les "id" comme des sous classes ou je suis mal formaté? Et puis pour finir <script> ca suffit, le <script language=JavaScript... c juste pour les debutants?
en tt cas merci.

Reply

Marsh Posté le 23-12-2003 à 15:44:44    

Je vois le NAME comme l'attribut qui sera envoyé comme identifiant la valeur du champs pour le serveur qui reçois le formulaire.
L'ID est un identifiant qui permet d'avoir accès à l'objet HTML dans le DOM du navigateur.
Tous les tags peuvent avoir un ID. Le name, je le réserve au éléments de formulaires, même si la norme l'autorise. Par exemple pour une image http://www.w3.org/TR/html401/struc [...] f-name-IMG
En même temps, il disent bien qu'on devrait utiliser l'ID dans un script, et que si le name est autorisé pour une image par exemple, c'est pour des raisons de compatibilité.


---------------
Laissez l'Etat dans les toilettes où vous l'avez trouvé.
Reply

Marsh Posté le 23-12-2003 à 15:46:52    

waaaaouuhhhhh! le resultat est plus plaisant que le code! je crois que je vais mieux comprendre les noeuds et les this avec ca mais bono les fetes de noel ca sera opas pour cette année!

Reply

Marsh Posté le 23-12-2003 à 16:03:23    

ctnul a écrit :

Et puis pour finir <script> ca suffit, le <script language=JavaScript... c juste pour les debutants?
 


 
aucun des deux.
Normalement on doit mettre <script type="text/javascript">


---------------
mes programmes ·· les voitures dans les films ·· apprenez à écrire
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed