Bonjour,

Je travaille sur un projet ou je dois découper une page en plusieurs parti selon le choix de l'utilisateur, il y à un header, un footer, et le body, body qui peux contenir plusieurs "section". On peux donc définir la hauteur ainsi que la couleur.

Ne sachant pas forcément combien il y aura de section dans le body, j'ai ajouté un bouton, et j'ajoute donc une section. Pour pouvoir ajouter la section sous la premiere généré au chargement de la page, j'ai fais ainsi :
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
	<h1 class="body">Body - Section</h1>
	<div class="section" id="1">
		<div class="input-group">
	  		<span class="input-group-addon" id="basic-addon1">Couleur</span>
	  		<input type="text" class="form-control" aria-describedby="basic-addon1" name="couleur-body">
		</div>
		<div class="input-group">
	  		<span class="input-group-addon" id="basic-addon1">Hauteur</span>
	  		<input type="text" class="form-control" aria-describedby="basic-addon1" name="hauteur-body">
		</div>
	</div>
	<div class="section" id="2">
	</div>
<button class="glyphicon glyphicon-plus plus"></button>
Dans mon code JQuery, j'applique mon append sur last() section. Pour pouvoir sortir de ma section deux, j'ai donc fais ainsi :
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
$('.plus').click(function(event) {
	id = $('.section').last().attr('id');
	id = parseInt(id);
	$('.section').last().append(
		"<div class='input-group'>"+
  			"<span class='input-group-addon' id='basic-addon1'>Couleur</span>"+
  			"<input type='text' class='form-control' aria-describedby='basic-addon1' name='couleur-body'>"+
		"</div>"+
		"<div class='input-group'>"+
  			"<span class='input-group-addon' id='basic-addon1'>Hauteur</span>"+
  			"<input type='text' class='form-control' aria-describedby='basic-addon1' name='hauteur-body'>"+
		"</div>"+
	"</div>"+
	"<div class='section' id="+(id= id + 1)+">");
});
J'ai fais exprès de fermer une div en trop pour fermer ma seconde section, et ainsi ouvrir la troisième section, qui est automatiquement fermé par la div de la section qui servait précédemment à fermer la deux (Si je suis pas assez clair, hésiter pas à me le dire !).

Le souci, c'est que ma section 3 se créait dans ma section 2, et ma section 4 dans ma section 3 et ainsi de suite. Hors, je voudrais créer mes sections chacune à l'extérieur de la précédente. Je ne pense pas me tromper dans mon code, alors ma question est, est-ce la fonction append qui remanie mon code ? Ou j'ai fais une erreur quelque pars ?

EDIT:
J'ai aussi essayé ainsi :
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
	<div class="body">
		<div class="section" id="1">
			<div class="input-group">
		  		<span class="input-group-addon" id="basic-addon1">Couleur</span>
		  		<input type="text" class="form-control" aria-describedby="basic-addon1" name="couleur-body">
			</div>
			<div class="input-group">
		  		<span class="input-group-addon" id="basic-addon1">Hauteur</span>
		  		<input type="text" class="form-control" aria-describedby="basic-addon1" name="hauteur-body">
			</div>
		</div>
		<div class="glyphicon glyphicon-plus plus"></div>
	</body>

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
 
	$('.plus').click(function(event) {
		id = $('.section').last().attr('id');
		id = parseInt(id);
		$('.section').after().last().append(
		"<div class='section' id="+(id= id + 1)+">"+
			"<div class='input-group'>"+
	  			"<span class='input-group-addon' id='basic-addon1'>Couleur</span>"+
	  			"<input type='text' class='form-control' aria-describedby='basic-addon1' name='couleur-body'>"+
			"</div>"+
			"<div class='input-group'>"+
	  			"<span class='input-group-addon' id='basic-addon1'>Hauteur</span>"+
	  			"<input type='text' class='form-control' aria-describedby='basic-addon1' name='hauteur-body'>"+
		"</div>");
	});
Et je me retrouve avec les sections 2 et 3 etc... dans ma section 1, je capte mal quelque chose ?

Merci d'avance pour les réponses.