11548 sujets

JavaScript, DOM et API Web HTML5

Ajout/Suppression de champs dans un formulaire avec Javascipt

Alors j'ai réussi sans trop de problème à trouver un code qui pourrait me convenir. Pour l'ajout pas (trop) de problème mais pour supprimer les éléments ajoutés ça coincent :



var c,c2,ch,textarea, label1, label2;

function plus(){
	
	c=document.getElementById("cadre");
	c2=c.getElementsByTagName("input","textarea");
	
	ch=document.createElement("input");
	textarea=document.createElement("textarea");
	label=document.createElement("label");
	upload=document.createElement("input");
	
	label1 = document.createTextNode("Entrer le titre");
	label2 = document.createTextNode("Entrer le contenu");
	ch.setAttribute("type","text");
	ch.setAttribute("class","inputformulaire");
	ch.setAttribute("name","ch"+c2.length);
	textarea.setAttribute("wrap","hard");
	textarea.setAttribute("name","textformulaire"+c2.length);
	textarea.setAttribute("class","textareaformulaire");
	upload.setAttribute("type","file");
	upload.setAttribute("name","upload"+c2.length);
	upload.setAttribute("type","file");

	c.appendChild(label1);
	c.appendChild(ch);
	c.appendChild(label2);
	c.appendChild(textarea);
	c.appendChild(upload);

	document.getElementById("sup").style.display="inline";
}

function moins(b){

	if(!c2[1]){
		b.style.display="none"
	}

	if(c2[0]){	
		c.removeChild(c2[c2.length-1])
	}

}


et l'html

<form id="frm" action="">
<div id="cadre" style="margin-left:100px;width:500px;background-color:#656565">
</div>

<p>
<input type="button" value="Nouvel article" onclick="plus()" />
<input type="button" style="display:none" id="sup" value="Supprimer" onclick="moins(this)" />
</p>
</form>


une solution?
Modifié par bwaais (15 Jul 2009 - 12:44)
Salut,

Un peu de patience, pas de réponse en 2h30, c'est loin d'être un signal d'abandon, surtout un lundi après-midi, pendant que les gens travaillent. Smiley smile

En ce qui concerne ton problème, la méthode getElementsByTagName() n'accepte qu'un seul argument. Du coup, dans getElementsByTagName("input", "textarea"), ton "textarea" est purement ignoré et tu ne récupères donc que les "input". Voilà pourquoi seuls ces derniers sont supprimés par ta fonction moins().

Pour te simplifier la vie, lorsque tu insères tes éléments (fonction plus()), insères-les groupés dans une div. Ensuite, dans ta fonction moins(), tu n'auras qu'à supprimer la div.
Sujet clos
Aller à