Sélécteur avec variable

Version imprimable

Bonjour, je rencontre quelques difficultés avec les sélécteurs Jquery, je voudrais placer une variable dans un sélécteur, mais je n'y arrive pas.

J'ai éssayé :
Code:

1 2 3 4 5 6 7 inputnom = '#nom_'+i; // i = id incrémenté if ($( inputnom ).length) { alert('solution 1 works'); //$( "#nom_1" ).val(nom); } if($('input[id="' + inputnom + '"]').length){ alert('solution 2 works');} if($("#nom_"+i).length){ alert('solution 3 works');}
Mais rien ne fonctionne :/

15/12/2014, 17h19
Bovino

Les solutions 1 et 3 devraient fonctionner à condition qu'il y ai bien un élément avec l'id nom_i dans la page au moment où le code est exécuté. Donc en gros que ce code soit exécuté après le chargement complet du DOM.

La solution 2 est incorrecte, car si tu cherches un élément avec la syntaxe CSS (#nom_i), ça signifie que l'id réel est nom_i or ton sélecteur recherche #nom_i qui n'existe pas.
15/12/2014, 17h24
SpaceFrog

un selecteur est un string ...
il se concatène comme un string

http://fiddle.jshell.net/4bth03ev/

Je crois que fonctionnellement je m'y prend mal. Pour un projet d'école je bosse sur un formulaire (de modification d'inscriptions) qui est est créé dynamiquement en javascript selon le nombre d'éléments inscrits en bdd, et pré-complété avec les informations tirées de la bdd.

J'rencontre effectivement quelques difficultées à caler le tout entre création du formulaire et remplissage des champs, j'éssaye d'utiliser une fonction de callback, enfin je crois, comme ceci :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 DisplayFormulaireIncrement(InputValuesIntoChamps); function DisplayFormulaireIncrement(InputValuesFunction){ for(i = 1; i<long; i++){ submitForm('Infoeleve'); //Display un nouveau fieldset InputValuesFunction(i); //Déclanche la fonction de remplissage du fielsdet } } function InputValuesIntoChamps(i){ inputnom = '#nom_'+i; inputn = 'nom_'+i; if ($( inputnom ).length) { alert('solution 1 works'); //$( "#nom_1" ).val(nom); } if($('input[id="' + inputn + '"]').length){ alert('solution 2 works');} if($("#nom_"+i).length){ alert('solution 3 works');} }
D'après ce que j'ai compris, sa devrait fonctionner. Mais non. Ou est-ce que je me plante ? :calim2:

15/12/2014, 17h49
StripMat

Non sa fonctionne pas mon truc, comment faire pour display le formulaire et une fois celui-ci entièrement présent sur mon DOM instancier les champs ? Quelque chose comme .done ?

Même si j'aurais préféré que chaque fieldset soit généré puis rempli avant de générer le fieldset suivant... Est-ce possible au moins ? :aie:

Problème résolu, mon problème était lié au côté asynchrone d'Ajax.

J'ai résolu mon problème autrement, j'ai préféré créer un tableau avec des champs en contenteditable='true' plutôt qu'une réplique de mon formulaire. Le principe est le même, j'avais également des difficultés à synchroniser création du tableau et remplissage des champs, que j'ai résolu comme ceci

Code:

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
$.ajax({
	url : 'getdata.php',
	type : 'GET'
})
.done(function(result) {
	submitForm('ModifEleve'); // Récupération du formalisme du tableau en bdd, <th><td>...
	StringJSON = JSON.parse(result); // Parsing du JSON
	$("#table") // Utilisation d'un petit plugin JQUERY <a href="https://gist.github.com/buu700/4200601" target="_blank">https://gist.github.com/buu700/4200601</a>
	.waitUntilExists(function() {
		for (i = 0; i < StringJSON.length; i++) { // For each occurence in JSON
			$("#table") // Création dynamique + ajou
			.append(
				'<tr><td contenteditable="true">'
				+ StringJSON[i].NOMELEVE
				+ '</td><td contenteditable="true">'
				+ StringJSON[i].IDCOURSE
				+ '</td><td contenteditable="true">'
				+ StringJSON[i].ANNEENAISSANCE
				+ '</td><td contenteditable="true">'
				+ StringJSON[i].ADRESSE
				+ '</td><td>'
				+ '<input type="checkbox" name="certificat_'+i+'" id="certificat_'+i+'" >'
				+ '</td><td contenteditable="true">'
				+ StringJSON[i].AUTORISATIONP
				+ '</td><td class="button validation" onclick="CheckModification">Valider</td><br><td class="button validation" onclick="DeleteEleve">supprimer</td></tr>'
			);
		}
	});
});
return;

Juste au cas ou d'autres seraient bloqués