Bonjour,

J'ai une page web dans laquelle j'ai une liste de personnes. Cette liste est dynamique (le nombre de personnes est sensible de varier).

https://jsfiddle.net/cx8hutvx/

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
44
45
46
47
48
49
50
51
52
53
54
55
 
                                          <form id="mainForm" action="">
						<div class="contact-form bottom">
							<div id="lstPersons" name="lstPersons">
								<div class="row person" id="person0" name="person">
									<div class="col-md-3  col-sm-12">
										<select class="form-control" id="cat0" name="cat">
										  <option value="A" selected>Adulte</option>
										  <option value="E">Enfant</option>
										  <option value="B">B&eacute;b&eacute;</option>
										</select>
									</div>
									<div class="col-md-3  col-sm-12">
										<input type="text" id="prenom0" class="form-control firstname" required placeholder="Prénom" name="prenom" />
									</div>
									<div class="col-md-3  col-sm-12">
										<input type="text" id="nom0" class="form-control lastname" required placeholder="Nom" name="nom" />
									</div>
									<div class="col-md-2  col-sm-12">
										<input type="text" name="allergies" class="form-control allergies" placeholder="Allergies..."  id="allergies0"/>
									</div>
									<div class="col-md-1  col-sm-12">
									</div>
								</div>
                                                                <div class="row person" id="person1" name="person">
									<div class="col-md-3  col-sm-12">
										<select class="form-control" id="cat1" name="cat">
										  <option value="A" selected>Adulte</option>
										  <option value="E">Enfant</option>
										  <option value="B">B&eacute;b&eacute;</option>
										</select>
									</div>
									<div class="col-md-3  col-sm-12">
										<input type="text" id="prenom1" class="form-control firstname" required placeholder="Prénom" name="prenom" />
									</div>
									<div class="col-md-3  col-sm-12">
										<input type="text" id="nom1" class="form-control lastname" required placeholder="Nom" name="nom" />
									</div>
									<div class="col-md-2  col-sm-12">
										<input type="text" name="allergies" class="form-control allergies" placeholder="Allergies..."  id="allergies1"/>
									</div>
									<div class="col-md-1  col-sm-12">
									</div>
								</div>
							</div>
 
                                                        <div class="row" style="margin-top:2em;">
								<div class="col-sm-12 text-centered">
									<button class="btn btn-success text-centered" type="button" id="btn-confirm">
									 <span class="badge"><span class="glyphicon glyphicon-send" aria-hidden="true"></span></span> Envoyer ma réponse
									</button>
								</div>
							</div>
                                                    </div>
                                                </form>
Le code suivant me retourne juste une liste de valeurs contenant plusieurs prenoms, plusieurs nom,...
Code : Sélectionner tout - Visualiser dans une fenêtre à part
console.log($('#mainForm').serializeArray());
exemple : [[name:cat;value:A],[name:prenom;value:AAA],[name:nom;value:AAA],[name:allergies;value:],[name:cat;value:A],[name:prenom;value:BBB],[name:nom;value:BBB],.......]


une idée de comment obtenir:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
[ 
    [name:person; value: [[name:cat;value:A],[name:prenom;value:AAA],[name:nom;value:AAA]]],
    [name:person; value: [[name:cat;value:A],[name:prenom;value:BBB],[name:nom;value:BBB]]],
    ....
]