J'ai une page avec un tas de listes déroulantes et chaque liste déroulante a un bouton à côté. Lorsque la page se charge initialement, je veux que tous les boutons soient désactivés et s'il y a un changement dans une liste déroulante spécifique, son bouton correspondant doit être activé.

J'ai le code suivant pour cela, mais j'ai besoin de savoir comment parcourir toutes les listes déroulantes et tous les boutons pour pouvoir le généraliser.

$(document).ready(function () {
  //disable all buttons
  function disableAllButtons () {
      $(':input[type=button]').attr("disabled", "true");
  }
  disableAllButtons();
  //enable button when drop down changes
  $(':input[name=sNewPKvalue1]').focus(function() {
      disableAllButtons();
      $(':input[name=Update0]').removeAttr("disabled");
  })
  //enable button when drop down changes
  $(':input[name=sNewPKvalue2]').focus(function() {
      disableAllButtons();
      $(':input[name=Update1]').removeAttr("disabled");
  })
  ////.....question?
});

Question

Si j'ai 12 listes déroulantes et 12 boutons

Comment parcourir toutes les listes déroulantes portant le nom sNewPKvalue[1-12] et tous les boutons portant le nom Update[0-11]

2
Omnipresent 3 nov. 2011 à 19:26

4 réponses

Meilleure réponse

Vous pouvez le faire de cette façon.

for (var i = 0; i < 12; i++)
{
  $(':input[name=sNewPKvalue'+(i+1)+']').focus(function() {
      disableAllButtons();
      $(':input[name=Update'+i+']').removeAttr("disabled");
  })
}

Ou

  $(':input[name^=sNewPKvalue]').focus(function() {
      disableAllButtons();
      $(':input[name=Update'+(Number(this.name.match(/[0-9]+/))-1)+']').removeAttr("disabled");
  })
0
Joseph Marikle 3 nov. 2011 à 15:28

Je ne recommanderais pas une boucle. Utilisez simplement un sélecteur qui sélectionne les éléments souhaités et effectuez l'action appropriée. Ma première pensée est d'assigner une classe CSS aux boutons et aux listes déroulantes dont vous parlez. Ensuite, vous pouvez simplement faire quelque chose comme ceci:

$('.dropDown').focus(function(){
   $(".ddlButton").attr("disabled", "true");
   $(this).closest('.ddlButton').removeAttr("disabled");
});
2
Abe Miessler 3 nov. 2011 à 17:27

Je ferais quelque chose comme:

$.each([1, 12], function(index, value) {
    var valmin = val - 1;
    $(':input[name=sNewPKvalue'+value+']').focus(function() {
        disableAllButtons();
        $(':input[name=Update'+valmin+']').removeAttr("disabled");
    })
});

Je n'ai pas testé celui-ci, mais vous devriez avoir l'idée;)

1
Michal B. 3 nov. 2011 à 15:29

Ce que vous pourriez faire est de créer une boucle for.

for(var i = 1; i <= 12; i++) {
    $("select[name='sNewPKvalue"+i+"']").doSomething();
}

for(var i = 1; i <= 11; i++) {
    $(":button[name='Update"+i+"']").doSomething();
}
0
user1027444user1027444 3 nov. 2011 à 15:33