Discussion :

[baggie]

Bonjour,

je pense que mon problème fait appel à de l'AJAX, à moins que je ne me complique pour rien (et ça ce serait gentil de me le dire ).

J'ai un formulaire avec plusieurs listes déroulantes, alimentées par le nom de sociétés provenant de la base de données. Chaque liste correspond à une catégorie différente.

Ex :
Assureur - <select></select> "+"
Installateur - <select></select> "+"
[...]

A côté de ces listes, j'ai un bouton "+" associé. Lorsque l'on clique dessus, j'aimerai faire apparaître juste en dessous de ma liste, la même liste avec le même nom de catégorie.

Ex :
Assureur - <select></select> "+" > je clique et ça affiche :

Assureur - <select></select>

Donc j'aurai deux fois la même liste, et je pourrai sélectionner une autre société appartenant à la même catégorie.

J'ai pensé au fait qu'il y avait les listes à choix multiples, mais esthétiquement parlant sur ma page, ça ne ferait pas terrible.
C'est pourquoi je cherche une autre solution !

J'ai donc commencé par créer une ligne avec le nom de ma catégorie, et la liste déroulante des sociétés, puis le bouton + :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
$nomcat = $catsoc['nom_categorie_societe'];
$idcat = $catsoc['id_categorie_societe'];
echo '<tr>';
echo '<td>'.$nomcat.'</td>
	<td><select name="'.$idcat.'">
			<option value="0-0">Sélectionnez une société</option>';
			$req = mysql_query("SELECT id_societe, nom_societe FROM societe ORDER BY nom_societe ASC;");
			while ($donnees = mysql_fetch_array($req))
			{
				echo '<option value="'.$donnees['id_societe'].'-'.$donnees['nom_societe'].'"'. $selected.'>'.$donnees['nom_societe'].'</option>';
			}
			echo '</select></td><td>';
			echo '<input type="button" name="add" value="+" onclick="add_soc('.$idcat.$nomcat.');"/></td></tr>';

Juste en dessous je me suis dit qu'il fallait créer un div pour afficher la nouvelle liste déroulante :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
echo '<tr><td><div id="div'.$idcat.$nomcat.'" style="display:none;"></div></td></tr>';

Et ma fonction add_soc() appelée sur le onClick du bouton + :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
function add_soc(id)
{
	document.getElementById('div'+id).style.display = 'block';
	document.getElementById('div'+id).innerHTML = '<select name="'+id+'"><option></option></select>';
}

Et pour le moment ça s'arrête ici. Je pensais ensuite faire appel à une requête Ajax pour remplir ma liste déroulante, mais ça me ferait créer encore un div à l'intérieur de celui ci ?

J'ai l'impression que ça va faire beaucoup de choses en fait tout ça pour recopier un élément.
D'autant plus qu'à ce stade là, j'ai cette erreur qui s'affiche :

missing ) after argument list
[Break on this error] add_soc(45assureur);

Donc est-ce que je pars dans la bonne direction ? Est-ce que je me complique beaucoup trop ?
Un peu d'aide serait la bienvenue ^^

[DoubleU]

Si c'est juste pour copier exactement la liste, utilises plutot un cloneNode.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
var laListeACopier = document.getElementById("lIdDeLaListeACopier")
var laDivOuAjouterLaListe = document.getElementById("lIdDeLaDivOuAjouterLaListe")
laDivOuAjouterLaListe.appendChild(laListeACopier.cloneNode(true)

[baggie]

J'ai utilisé ta solution :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
echo '<input type="button" name="add" value="+" onclick="add_soc('.$idcat.');"/></td></tr>';
echo '<tr><td><div id="div'.$idcat.'" style="display:none;"></div></td></tr>';

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
function add_soc(id)
{
	var laListeACopier = document.getElementById(id)
	var laDivOuAjouterLaListe = document.getElementById("div"+id)
	laDivOuAjouterLaListe.appendChild(laListeACopier.cloneNode(true)
}

Dès l'entrée sur la page j'ai cette erreur :

missing ) after argument list

et ça me retourne cette erreur une fois testé :

add_soc is not defined
function onclick(event) { add_soc(45); }

Ce qui signifie que la fonction n'existe pas ?

[DoubleU]

Oui ^^

[baggie]

Mais euuuuh, si elle est bien déclarée dans mon code, pourquoi qu'il me dit ça firebug ? Oo

Dès que j'ouvre la page j'ai cette erreur :

missing ) after argument list
[Break on this error] laDivOuAjouterLaListe.appendChild(laListeACopier.cloneNode(true);\n

EDIT : ben oui forcément ... x) et si je veux récupérer le nom de ma catégorie en plus ? Est-ce que je peux faire : add_soc(id,nom) puis ensuite faire deux appendchild ?

EDIT 2 :
j'ai testé :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
 
function add_soc(id,nom)
{
	document.getElementById("div"+id).style.display = 'block';
	var laListeACopier = document.getElementById(id);
	var leTdACopier = document.getElementById(nom);
	var laDivOuAjouterLaListe = document.getElementById("div"+id);
	laDivOuAjouterLaListe.appendChild(leTdACopier.cloneNode(true));
	laDivOuAjouterLaListe.appendChild(laListeACopier.cloneNode(true));
}

avec :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

echo '<input type="button" name="add" value="+" onclick="add_soc('.$idcat,$nomcat.');"/></td></tr>';

mais j'ai toujours cette erreur de parenthèse manquante, sauf que là je n'arrive pas à voir où :/ (et pour mettre id,nom dans ma fonction je sais pas trop comment faire non plus)

[E.Bzz]

Bonjour,

mais j'ai toujours cette erreur de parenthèse manquante,

la syntaxe étant correcte à présent, ça peut être un problème de cache

=> CTRL + F5 ?

A+

[kernelfailure]

...Parce que tu as oublié une fin de parenthèse

...(true))