Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
906 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [Javascript / DOM (?)] Renommer un element de formulaire

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

[Javascript / DOM (?)] Renommer un element de formulaire

n°1387910
Eldrik
Posté le 15-06-2006 à 09:28:50  profilanswer
 

Salut à tous !
 
Je suis en train de faire un code en javascript, qui sur une page html récupère le premier fils d'une balise <fieldset>, et en crée une copie à la fin de cette même balise...
 
Seulement, vu que ces entrées doivent etre récupérées dans un formulaire, j'aimerais pouvoir changer le nom des input ou select que je copie, sinon je ne peux récupérer les infos de la derniere copie que j'ai effectuée seulement..
 
Brefle, voila le code, si des âmes charitables sont prêtes à me donner un petit conseil... Merci d'avance ;)
 
Les fonctions JS :

Code :
  1. echo '<script type="text/javascript">
  2. nbcases=1;
  3. function addDiplome(id)
  4. {
  5. var diplome = document.getElementById("fs"+id).cloneNode(true);
  6. document.getElementById("formation" ).appendChild(diplome);
  7. nbcases=nbcases+1;
  8. }
  9. function delDiplome()
  10. {
  11.   if(nbcases!=1)
  12.   {
  13.     formation.removeChild(formation.lastChild);
  14.     nbcases=nbcases-1;
  15.   }
  16. }
  17. </script>';


 
Le formulaire à proprement parler :

Code :
  1. echo "<fieldset id='formation' style='height: auto;'><legend>Formation :</legend>";
  2. echo "<a href=\"javascript:addDiplome('0');\">[Ajouter un diplome]</a>&nbsp;-&nbsp;<a href=\"javascript:delDiplome();\">[Supprimer le dernier diplome]</a>";
  3. //Liste déroulante des formations, des diplôme et année du diplôme
  4. echo "<fieldset id='fs0'><label>Type de formation : </label>";
  5. echo "<select name='type_formation'>";
  6. echo "<option value='-1'>Inconnu/Autre";
  7. echo "<option value='0'>Initiale";
  8. echo "<option value='1'>Continue";
  9. echo "</select><br />";
  10. echo "<label>Diplôme :</label>";
  11. echo "<select name='diplome_lib'>";
  12. echo "<option>...</option>";
  13. echo "<option>...</option>";
  14. echo "<option>...</option>";
  15. echo "<option>...</option>";
  16. echo "<option>...</option>";
  17. echo "<option>...</option>";
  18. echo "<option>...</option>";
  19. echo "<option>...</option>";
  20. echo "<option>...</option>";
  21. echo "<option>...</option>";
  22. echo "</select><br />";
  23. echo "<label>Année d'obtention du diplôme :</label><input type='text' name='annee' size='4' maxlength='4' value='".$diplome_annee."'><br /></fieldset>";
  24. echo "</fieldset><br />";


 
PS : Les value des options sont manquantes, c'est normal...
Le fieldset à copier est donc 'fs0', et il est toujours rajouté à la fin de 'formation'
Il me faudrait donc le renommer en fs1, fs2, ainsi de suite.. et renommer les input et select contenus en type_formation+id par exemple.
 
J'ai essayé des getElementByName("type_formation" ).name="xxx"; mais ça ne passe pas... Idem avec .nodeName .. je n'arrive pas vraiment à trouver d'exemple ou de tutorial sur ça.
 
N'hésitez pas à me dire si c'est sérieusement crade ou pas comme code... C'est mon premier essai seulement  :hello:
 
Edit 2 : La variable id ne sert pas à grand chose pour le moment, je l'ai gardée depuis quelque modifications où elle servait à quelque chose.. :jap:


Message édité par Eldrik le 15-06-2006 à 09:41:21
mood
Publicité
Posté le 15-06-2006 à 09:28:50  profilanswer
 

n°1387940
nargy
Posté le 15-06-2006 à 10:30:37  profilanswer
 

ouais, hyper crade ;)
 
J'ai pas très bien compris le problème, en fait, c'est un poil confu.
 
J'ai l'impression que tu veux faire une sorte de liste de diplomes, avec des boutons pour ajouter/supprimer des diplomes en JS.
 
Dans ce cas, plutôt que de copier/coller un diplôme existant, pourquoi pas ajouter un diplome vide, avec les champs qui faut, puis le remplir avec des valeurs par défaut? Les valeurs par défaut peuvent être prisent dans un autre diplome, ou fixées au départ.
 
Petite remarque en passant: dans le CSS height:auto ne sert pas à grand chose, si?
 
Edit: essaye: element.innerHTML='du html ici';


Message édité par nargy le 15-06-2006 à 10:33:03
n°1387988
Eldrik
Posté le 15-06-2006 à 11:34:01  profilanswer
 

Hello, c'est ça pour l'idée - je gère des étudiants qui passent un diplome ou plus, et ce serait le formulaire de saisie pour lui en rajouter ou lui en supprimer...
Si j'avais pu copier / coller la partie existante et changer le name ça aurait été pratique et rapide :)
 
Je comprends pas vraiment; quand tu dis plutot que de copier/coller un diplome existant... Le code donnée plus haut ne me copie pas les choix déja faits, simplement la structure?
 
Le height: auto; ne sert à rien en effet, c'est encore un reste qui n'a rien à faire là...
 
Je vais nettoyer toute cette maÿrde et voir le element.innerHTML qui a l'air bien intéréssant ;)
 
Merci pour les infos !

n°1387998
nargy
Posté le 15-06-2006 à 11:41:15  profilanswer
 

J'ai l'impression que tu fais ça avec PHP.
P'tit indication: ne perd pas patience sur l'imbrication de HTML dans du javascript dans du HTML dans du PHP... enfin, tu va comprendre, joue un peu avec addslahes() et htmlentities().
 
Sinon, ouais c'est une sorte de copier/coller que tu faisait.
 
Autre petite remarque: tu as deux tags par diplôme, <fieldset> et <br>, ce qui fait que je ne suis pas sûr que ta fonction JS qui removeLastChild() fonctionne parfaitement...

n°1388006
Eldrik
Posté le 15-06-2006 à 11:47:47  profilanswer
 

Hop, voila à quoi ça ressemble, seul souci est qu'il manque donc le renommage des champs, et donc probleme lors du POST :
http://img92.imageshack.us/img92/6165/diplome1tv.th.jpg
 
Non, je perds pas patience ;)
 
Et le removeLastChild() passe en effet sous fofox et non sous IE... Je vais voir cette balise :jap:

n°1388008
nargy
Posté le 15-06-2006 à 11:49:44  profilanswer
 

il me semble qu'en utilisant le CSS:
clear: both;
tu peut éviter le <br>


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [Javascript / DOM (?)] Renommer un element de formulaire

 

Sujets relatifs
Transmettre une variable d'un popup à un formulaire ?envoyer un formulaire dans un formulaire...
[RESOLU] liaison javascript / PHP[javascript] Interpreter les balises html
[JAVASCRIPT] Un pied de page qui ne marche pas...formulaire HTML sans script CGI
Liens et javascriptComparaison attribut d'élément
Formulaireformulaire et popup
Plus de sujets relatifs à : [Javascript / DOM (?)] Renommer un element de formulaire


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR