Input avec name="array[]"

**izy-gaylord** · 11/02/2015, 14h12

Bonjour,

Je vous explique mon soucis ainsi que le contexte qui est un peu spécial.

Dans un formulaire simple pour ajouter un établissement. J'ai une section où l'utilisateur peut renseigner ses différentes formations de son établissement. J'ai donc voulu gérer sa dynamiquement. Donc lorsqu'il rempli les champs de la section formations il y a un faux bouton submit javascript. Qui lorsqu'il est cliqué ajoute une div en dessous de cette section avec les infos de la formations, puis il peut en ajouter d'autres et ainsi de suite (code ci-dessous).

Lorsqu'il a saisie toutes ses formations et les autres infos de l'établissement, je souhaite récupérer toutes les infos ainsi que toutes les formations. Le soucis est ici. Pour afficher les infos des formations j'ai créer une div avec tout les éléments récupérer ainsi que des champs hidden pour stocker les variables pour récupérer en post dans mon PHP.

J'ai donc voulu y mettre un name="formation[]" pour récupérer un tableau en PHP. Cependant lorsque je fais un var_dump j’obtiens seulement la valeur du dernier champs hidden.

JAVASCRIPT

Code javascript :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
function AjoutFormation(){
	getNiveau = document.getElementById('form_niveau');
	getCateg = document.getElementById('form_categ_formation');
	getFiliere = document.getElementById('form_filiere');
	getIntitule = document.getElementById('formation_intitule');
	getDesc = document.getElementById('formation_description');
	getDuree = document.getElementById('formation_duree');
	getfrais = document.getElementById('formation_frais');
	getAdmission = document.getElementById('formation_admission');
	getInitial = document.getElementById('parcours_1');
	getAltern = document.getElementById('parcours_2');
	getDist = document.getElementById('parcours_3');
 
	niveau = ''; if(getNiveau.value != 0) niveau = getNiveau.options[getNiveau.selectedIndex].text; 
	formation = ''; if(getCateg.value != 0) formation =getCateg.options[getCateg.selectedIndex].text;
 
	filiere = ''; if( getFiliere != null && getFiliere.value != 0){
		filiere = getFiliere.options[getFiliere.selectedIndex].text; 
	}
 
	initial = getInitial.checked; if(initial == false){initial = '';}else{initial = ' - Initial'; }
	alternance = getAltern.checked; if(alternance == false){alternance = '';}else{alternance = ' - Alternance'; }
	distance = getDist.checked; if(distance == false){distance = '';}else{distance = ' - Distance'; }
 
	intitule = getIntitule.value; ;
	description = getDesc.value;;
	duree = getDuree.value; ;
	frais = getfrais.value; ;
	admission = getAdmission.value; ;
 
	if(niveau != '' && filiere != '' && formation != '' && (initial != false || alternance != false || distance != false) && intitule != '' && description != ''){
		var innerDiv = document.createElement('div');
		innerDiv.className = 'formation-block';
		innerDiv.id = Math.floor(Math.random() * (999 - 1 + 1)) + 1;
		innerDiv.innerHTML = '<p class="title-formation" value="">■ '+niveau+'</p><p class="filiere">→ '+formation+' - '+filiere+initial+alternance+distance+'</p><p id="'+innerDiv.id+'-7" class="intitule-formation">'+intitule+'</p><p id="'+innerDiv.id+'-8" class="description-formation">'+description+'<p><ul><li><strong>Durée</strong>: <span id="'+innerDiv.id+'-9">'+duree+'</span></li><li><strong>Frais</strong>: <span id="'+innerDiv.id+'-10">'+frais+'</span></li><li><strong>Admission</strong>: <span id="'+innerDiv.id+'-11">'+admission+'</span></li></ul><a id="delet-formation" class="button" onclick="SuprFormation('+innerDiv.id+')">Supprimer</a><a id="modif-formation" class="button" onclick="ModifFormation('+innerDiv.id+')">Modifier</a><div class="displaynone"><input id="'+innerDiv.id+'-1" type="hidden" value="'+getNiveau.selectedIndex+'" name="formation[]"/><input id="'+innerDiv.id+'-2" type="hidden" value="'+getCateg.selectedIndex+'" name="formation[]"/><input id="'+innerDiv.id+'-3" type="hidden" value="'+getFiliere.selectedIndex+'" name="formation[]"/><input id="'+innerDiv.id+'-4" type="hidden" value="'+getInitial.checked+'" name="formation[]"/><input id="'+innerDiv.id+'-5" type="hidden" value="'+getAltern.checked+'" name="formation[]"/><input id="'+innerDiv.id+'-6" type="hidden" value="'+getDist.checked+'" name="formation[]"/></div>';
 
		document.getElementById('ajout-formation').appendChild(innerDiv);
 
		getNiveau.selectedIndex = 0;
		getCateg.selectedIndex = 0;
		getFiliere.selectedIndex = 0;
		getInitial.checked= false;
		getAltern.checked= false;
		getDist.checked= false;
		getIntitule.value = ''
		getDesc.value = ''
		getDuree.value = ''
		getfrais.value = ''
		getAdmission.value = ''
	}
	else{
		alert('Veuillez remplir tout les champs obligatoires.');
	}
}

Résultat var_dump

Code :

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

1
2
3
'formation' => 
    array (size=1)
      0 => string 'false' (length=5)

Merci d'avance.

**NoSmoking** · 11/02/2015, 19h35

Bonjour,
commence par regarder le code HTML, il faut qu'il soit bien formé, que tu injectes dans ton élément.

Cette méthode d'injection ne me paraît pas être la meilleur dans ton cas.

**izy-gaylord** · 12/02/2015, 11h44

Je ne pense pas que cela soit lié à mon html, je pense qu'il est structuré correctement.

Si tu as des propositions ou des conseils je suis bien sûr à l'écoute.

Pensez-vous que cela peut être lié avec le fait que je ne récupère que le dernier input contenant le name formation[] dans mon var_dump($_POST)?

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<div id="ahout-formation">
	<div id="604" class="formation-block">
		<p class="title-formation" value="">■ Bac +5</p>
		<p class="filiere">→ Arts et Culture - Artisanat - Initial - Alternance</p>
		<p id="604-7" class="intitule-formation">Intitulé</p>
		<p id="604-8" class="description-formation">Description</p>
		<ul>
			<li><strong>Durée</strong>: <span id="604-9">15mois</span></li>
			<li><strong>Frais</strong>: <span id="604-10">500</span></li>
			<li><strong>Admission</strong>: <span id="604-11">Sur concours</span></li>
		</ul>
		<a id="delet-formation" class="button" onclick="SuprFormation(604)">Supprimer</a>
		<a id="modif-formation" class="button" onclick="ModifFormation(604)">Modifier</a>
		<div class="displaynone"><input id="604-1" value="5" name="formation[]" type="hidden">
			<input id="604-2" value="2" name="formation[]" type="hidden">
			<input id="604-3" value="2" name="formation[]" type="hidden">
			<input id="604-4" value="true" name="formation[]" type="hidden">
			<input id="604-5" value="true" name="formation[]" type="hidden">
			<input id="604-6" value="false" name="formation[]" type="hidden">
		</div>
	</div>
	<div id="396" class="formation-block">
		<p class="title-formation" value="">■ Bac</p
		><p class="filiere">→ Banque et Finance - Assurance - Initial - Alternance</p>
		<p id="396-7" class="intitule-formation">Licence Journalisme</p>
		<p id="396-8" class="description-formation">Description</p>
		<ul>
			<li><strong>Durée</strong>: <span id="396-9">1 an</span></li>
			<li><strong>Frais</strong>: <span id="396-10"></span></li>
			<li><strong>Admission</strong>: <span id="396-11">Sur dossier</span></li>
		</ul>
		<a id="delet-formation" class="button" onclick="SuprFormation(396)">Supprimer</a>
		<a id="modif-formation" class="button" onclick="ModifFormation(396)">Modifier</a>
		<div class="displaynone">
			<input id="396-1" value="1" name="formation[]" type="hidden">
			<input id="396-2" value="3" name="formation[]" type="hidden">
			<input id="396-3" value="1" name="formation[]" type="hidden">
			<input id="396-4" value="true" name="formation[]" type="hidden">
			<input id="396-5" value="true" name="formation[]" type="hidden">
			<input id="396-6" value="false" name="formation[]" type="hidden">
		</div>
	</div>
</div>

**izy-gaylord** · 13/02/2015, 09h21

Problème résolu:

J'avais un autre champs ayant comme name="formation" du coup je ne pouvais pas utilisé formation[].

Input avec name="array[]"

JavaScript

Discussions similaires

Partager

Partager