Ajout de champ dynamiquement [Résolu/Fermé]

Signaler
Messages postés
65
Date d'inscription
mardi 8 juin 2010
Statut
Membre
Dernière intervention
30 septembre 2010
-
Messages postés
65
Date d'inscription
mardi 8 juin 2010
Statut
Membre
Dernière intervention
30 septembre 2010
-
Bonjour,

Je suis en stage dans une entreprise, je développe une application intranet.
Dans cette appli, les agents de l'entreprise se connecte et peuvent remplir un formulaire qu'il remplisse.
Pour des raisons d'ergonomie, on m'a demandé de rajouter des champs dynamiquement en fonction de la volonté de l'agent. J'ai donc compris que cela ce faisait avec du javascript cependant, je n'en ai vu qu'une très petite partie et ne sais toujours pas comme cela fonctionne réelement. J'aurais donc besoin de vous pour m'aider à comprendre ce bout de code trouvé sur le net afin que je puisse l'adapter à mon application.

Merci pour votre aide.

<script type="text/javascript">
 
var c,c2, ch;
 
// ajouter un champ avec son "name" propre;
function plus(){
c=document.getElementById('cadre');
c2=c.getElementsByTagName('input');
ch=document.createElement('input');
 
ch.setAttribute('type','text');
ch.setAttribute('name','ch'+c2.length);
c.appendChild(ch);
 
document.getElementById('sup').style.display='inline';
}
 
// supprimer le dernier champ;
function moins(){
if(c2.length>0){c.removeChild(c2[c2.length-1])}
if(c2.length==0){document.getElementById('sup').style.display='none'};
}
 
</script>


6 réponses

Messages postés
18557
Date d'inscription
dimanche 17 février 2008
Statut
Contributeur
Dernière intervention
4 mai 2021
4 287
Ce script utilise le DOM.
https://fr.wikipedia.org/wiki/Document_Object_Model
getElementById : récupérer une balise par son attribut "id"
getElementsByTagName : récupérer une liste de balises en fonction du nom de cette balise
document.createElement : créer une balise
appendChild : ajouter l'enfant à la fin du noeud
setAttribute : modifie la valeur d'un attribut
Messages postés
65
Date d'inscription
mardi 8 juin 2010
Statut
Membre
Dernière intervention
30 septembre 2010
40
"appendChild : ajouter l'enfant à la fin du noeud"

Excuse moi l'expression -> "Lol".
Ca veut dire quoi s'te phrase ? Tu ajoutes un enfant au bout de quel noeud ?
(Je connais rien au javascript j'ai juste vu en fin d'année que c'était un langage exécuté coté client et qui jouait sur les évènements on a fait la déclaration de variable et 2 boucles mais on a pas vu pour la maltraitance des enfants :D )

Pourrais-tu me donner plus de précision sur cette ligne de code ?
Messages postés
18557
Date d'inscription
dimanche 17 février 2008
Statut
Contributeur
Dernière intervention
4 mai 2021
4 287
On ajoute un noeud (une balise) à la fin du noeud qui appelle cette méthode.
Exemple :
article = document.createElement('div');
article.className = 'article';

titre = document.createElement('h3');
titre.innerHTML = 'Mon titre';

article.appendChild(titre);
Donnera :
<div class="article">
    <h3>Mon titre</h3>
</div>
Messages postés
65
Date d'inscription
mardi 8 juin 2010
Statut
Membre
Dernière intervention
30 septembre 2010
40
Donc, si j'ai bien compris, c'est cette instruction qui permet de mettre la balise dans le noeud. Est-ce exact ?
Messages postés
18557
Date d'inscription
dimanche 17 février 2008
Statut
Contributeur
Dernière intervention
4 mai 2021
4 287
Oui.
Messages postés
65
Date d'inscription
mardi 8 juin 2010
Statut
Membre
Dernière intervention
30 septembre 2010
40
Merci. {Résolu}