JS/DOM Liste déroulante

Résolu/Fermé
vincentdu76 - 8 juin 2010 à 10:26
 vincentdu76 - 8 juin 2010 à 11:52
Alors voila, je crée un div contenant du texte, un input avec incrémentation. Ca cela marche :) Je pensé avoir compris un peu DOM.
Et puis j'ai décidé de rajouter une liste déroulante à ce div, et la patatra... Qu'ai je mal fais ?

Merci d'avance :)


var compteur = 0;
function ajouter()
{

	var conteneur   = document.getElementById('ul1');
	
	var undiv      = document.createElement('li');
	var fich      = document.createElement('input');
	var check      = document.createElement('input');
	var ld_choix      = document.createElement('select');
	var label = document.createElement('label');
	var texte = document.createTextNode("Nom : ");
			
				
	var opt1 = document.createElement('option');
	var opt2 = document.createElement('option');
	var opt3 = document.createElement('option');
			
	var i = parseInt(document.getElementById('hidden').value);

	i = i + 1;
	document.getElementById('hidden').value=(i);

			
	undiv.id   = 'rech_rap';
	fich.setAttribute(('name'), ('nom_'+i));
			
			
	fich.type   = 'text';
	fich.id   = ('nom');
	check.type   = 'checkbox';
			
	ld_choix.setAttribute(('name'), ('nomld_'+i));
	opt1 = setAttribute("value","1");
	opt2 = setAttribute("value","2");
	opt3 = setAttribute("value","3");
			

            // On enlève sur le click de la checkbox
            check.onclick = function()
			{
               // Elément à enlever
               lediv      = this.parentNode;
               // Elément auquel on enlève
               lefieldset   = lediv.parentNode;
               // On enlève !
               lefieldset.removeChild(lediv);
            }


			
			label.appendChild(texte);
			undiv.appendChild(label);
            undiv.appendChild(fich);
			
            undiv.appendChild(check);
            undiv.appendChild(document.createTextNode("Enlever"));
			
			opt1.appendChild(document.createTextNode(">Commence par"));
			opt2.appendChild(document.createTextNode(">Contient"));
			opt3.appendChild(document.createTextNode(">Est exactement"));
			
			
			ld_choix.appenChild(opt1);
			ld_choix.appenChild(opt2);
			ld_choix.appenChild(opt3);
			undiv.appenChild(ld_choix);	
			
            // Ajout du div :
			
            conteneur.appendChild(undiv);
			
			
			
         }
A voir également:

3 réponses

xav3601 Messages postés 3288 Date d'inscription lundi 10 novembre 2008 Statut Membre Dernière intervention 2 mars 2016 311
8 juin 2010 à 10:28
Re salut ^^
Tu peux mettre uniquement la partie du code qui marche pas au milieu de tout ca ^^
0
function ajouter()
{

	var conteneur   = document.getElementById('ul1');
	
	var undiv      = document.createElement('li');
	var ld_choix      = document.createElement('select');			
				
	var opt1 = document.createElement('option');
	var opt2 = document.createElement('option');
	var opt3 = document.createElement('option');
			
	

			
	undiv.id   = 'rech_rap';
	
			
	ld_choix.setAttribute(('name'), ('nomld_'+i));
	opt1 = setAttribute("value","1");
	opt2 = setAttribute("value","2");
	opt3 = setAttribute("value","3");
			

			
			opt1.appendChild(document.createTextNode(">Commence par"));
			opt2.appendChild(document.createTextNode(">Contient"));
			opt3.appendChild(document.createTextNode(">Est exactement"));
			
			
			ld_choix.appenChild(opt1);
			ld_choix.appenChild(opt2);
			ld_choix.appenChild(opt3);
			undiv.appenChild(ld_choix);	
			
            // Ajout du div :
			
            conteneur.appendChild(undiv);		
			
			
}
0
xav3601 Messages postés 3288 Date d'inscription lundi 10 novembre 2008 Statut Membre Dernière intervention 2 mars 2016 311
8 juin 2010 à 10:36
C'est normal que tu créés un div en faisant:
var undiv = document.createElement('li');

Ca serait pas mieux avec:

var undiv = document.createElement('div');
0
euh oui c'est normal ^^ j'ai fait un li et le conteneur est dans un ul nommé ul 1
0
xav3601 Messages postés 3288 Date d'inscription lundi 10 novembre 2008 Statut Membre Dernière intervention 2 mars 2016 311
8 juin 2010 à 10:46
hmm alors c'est tes commentaires qui sont bizarre ^^
et sinon c'est quoi l'erreur qui en ressors si y'en à une?
0
Ba plus rien ne s'affiche. Enfait, quand je clic sur un bouton, un nouveau <li> se créer avec un champ input et une liste déroulante à coté, mais la depuis que j'ai rajouté la liste déroulante, plus rien...
0
xav3601 Messages postés 3288 Date d'inscription lundi 10 novembre 2008 Statut Membre Dernière intervention 2 mars 2016 311
8 juin 2010 à 10:50
essaye de rajoute au fur et a mesure les lignes de création du select pour voir la quelle fais planter (les joies du debugging sour JS xD)
0
Bon ba j'ai retourné le problème.
J'ai fait truc.innerHTML =("<SELECT> OPTION .......");

Et la çà marche :)
0
xav3601 Messages postés 3288 Date d'inscription lundi 10 novembre 2008 Statut Membre Dernière intervention 2 mars 2016 311
8 juin 2010 à 11:39
y'avais bien du innerHTML dans le lot alors ^^
C'est cool tant mieux!
0
Ba normalement tu peut faire sans.
Sinon sa sert à rien de faire des createElement et des setAttribut, tu passe direct par innerHTML, mais bon ça marche, tant mieux :)

Merci de ton aide xav3601
0