Discussion :

[jexl]

Bonjour à tous,

afin d'optimiser un petit code, je me pose une question : est-il possible de rendre dynamique le noms des variables d'une fonction.
Par exemple, si j'ai la fonction suivante :

Code :

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

1
2
3
 
$(function () {
$('#suppr_actif_1').click(function() {$('#id_photo_1').val('');});

par

Code :

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

1
2
3
 
$(function (x) {
$('#suppr_actif_'+x).click(function() {$('#id_photo_'+x).val('');});

Vous voyez le principe ?
je sais pas si c'est possible en JS

[SpaceFrog]

je ne vois pas de variable dynamique dans ton code ...
juste une concaténation de string pour un sélecteur

le plus simple encore est d'attribuer le clcik ainsi ...

Code :

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

1
2
3
$('[id^="suppr_actif_"]).click(function() {
 idx= $(this).attr('id).replace(/[^0-9]/g,'');
$('#id_photo_'+idx).val('');});

[Watilin]

Tu ne peux pas directement passer ce que tu veux en paramètre à la fonction telle que tu l'as écrite :

Code :

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

1
2
3
4
 
$(function(x) {
  ...
});

Car quand tu passes une fonction à $(...), cette fonction reçoit l'objet jQuery comme paramètre. Ça sert notamment à éviter d'utiliser la variable $ quand le site repose sur plusieurs bibilothèques :

Code :

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

1
2
3
$(function(jQuery) {
   ...
});

En revanche, peut-être que le concept de fermeture (closure) va t'intéresser : en bref, il s'agit d'utiliser les variables du bloc de contexte supérieur.

Code :

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

1
2
3
4
5
6
7
8
9
$(function() {
 
   var x = 1;
 
   (function() {
      $('#suppr_actif_' + x).click(function() {$('#id_photo_' + x).val(''); });
   }()); // la fonction est immédiatement invoquée
 
});

[jexl]

Merci à vous 2 pour ce retour.
Donc j'ai 2 solutions, soit les expressions régulières pour la solution de spaceFrog, soit de faire une boucle pour la solution de Wtilin comme par exemple :

Code :

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

1
2
3
4
5
6
7
$(function() {
   for(x = 1; x < 9; $i++){
   (function() {
      $('#suppr_actif_' + x).click(function() {$('#id_photo_' + x).val(''); });
   }()); // la fonction est immédiatement invoquée
}
});

j'ai bien compris ?
je ne suis pas très à l'aise avec jquery, mais ca donne envie de pousser l'apprentissage, c'est super intéressant.
Merci encore pour votre aide

[SpaceFrog]

Je ne vois aucun intérêt à passer par une boucle, le selecteur permettant de cibler directement la collection

Code :

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

$('[id^="suppr_actif_"])

[jexl]

je m'y suis peut-être mal pris, mais j'ai pas réussi à faire fonctionner le code

Code :

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

1
2
3
4
5
 
$('[id^="suppr_actif_"]').click(function() {
idx= $(this).attr('id').replace(/[^0-9]/g,'');
$('#id_photo_'+idx).val('');
$('#retour_photo_'+idx).removeAttr('style');});

j'ai écris une bétise ?

[SpaceFrog]

regarde au moins en console pour vérifier la valeur de idx ...

[jexl]

il manque un smiley 'honte sur moi' :o)
j'ai pas encore les bons reflexes pour trouver les erreurs avec jquery.
le problème était tout bête, il manquait la déclaration de variable.

le code suivant marche à merveille :

Code :

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

1
2
3
4
$('[id^="suppr_actif_"]').click(function() {
var idx= $(this).attr('id').replace(/[^0-9]/g,'');
$('#id_photo_'+idx).val('');
$('#retour_photo_'+idx).removeAttr('style');});

Un ENORME merci SpaceFrog pour ce coup de main.
Je ne suis pas certain de pouvoir reproduire tout seul ce code, mais ca m'aide dans mon dev et optimise grandement mon code.