Comment puis-je vérifier si une option existe déjà dans select by JQuery

169

Comment puis-je vérifier si une option existe déjà dans select by JQuery?

Je souhaite ajouter dynamiquement des options dans select et je dois donc vérifier si l'option existe déjà pour éviter la duplication.

jquery

— Gamelle
source

333

Cela prend la valeur true s'il existe déjà:

$("#yourSelect option[value='yourValue']").length > 0;

— Tamas Czinege
source

5

Mise à niveau vers Jquery 1.6 +, mettez votre valeur entre guillemets

— Bob le

1

Oui. Les citations sont très importantes.

— bobetko

2

Fonctionne pour moi dans jquery 1.7.1 sans mettre votre valeur entre guillemets

— Mathias F

Comment ignorer la casse ou toLowerCase peut-il être implémenté dans la solution ci-dessus? Cela nécessiterait-il un $ .each pour la liste déroulante?

— Ben Sewards

1

si nous voulons implémenter une correspondance sensible à la casse, que devons-nous faire? utiliser la simple fonction $ .each?

— Chaudhry Waqas

21

Une autre façon d'utiliser jQuery:

var exists = false; 
$('#yourSelect  option').each(function(){
  if (this.value == yourValue) {
    exists = true;
  }
});

— HaMinh Nguyen
source

6

-1 Vous faites essentiellement la boucle vous-même au lieu de laisser jQuery le faire comme toutes les autres réponses. Bien que cela fonctionnerait, il réinvente la roue.

— Peter

14

pas sûr que ce soit -1 digne. cela montre explicitement le processus, ce qui peut être bon pour les débutants. Ce n'est certainement pas la meilleure réponse, mais c'est une réponse valable.

— roberthuttinger

1

Et certains aiment l'approche manuelle, comme moi. Cela combine également l'étape consistant à ajouter le booléen là-dedans, au lieu de produire le 0 ou 1 comme l'autre le fait et d'avoir à le convertir. Je dis que les deux approches sont bien parce que vous devez faire 2 étapes, de toute façon. Cela me semble plus visible pour le processus, et moins sujet à l'erreur en ne jugeant pas la longueur de l'espace blanc, par exemple, comme .lengthpourrait le faire.

— vapcguy

3

Plus un pour ceux-ci, vous n'avez pas non plus à vous soucier des personnages de votre valeur

— Fabio C.

1

Cette réponse et celle d'alnort29 sont en fait la meilleure façon de vérifier une valeur existante, si vous ne savez pas ce qu'est "yourValue" (par exemple, si c'est une entrée utilisateur). Construire une seule chaîne juste pour laisser «jQuery le faire» vous obligerait à effectuer un nettoyage des entrées, et vous vous retrouverez avec des pratiques de code qui hantent SQL depuis des décennies. Donc, un -1 est totalement injustifié. La question précise même qu'ils veulent insérer des valeurs "dynamiquement". Ne corrigez pas votre chaîne de manière dynamique. Vous ne faites pas non plus 'sélectionner 1 parmi les utilisateurs où mot de passe = "' + chaîne + '"', n'est-ce pas?

— Aaa

20

if ( $("#your_select_id option[value=<enter_value_here>]").length == 0 ){
  alert("option doesn't exist!");
}

— Seb
source

2

il vous manque un crochet fermant "option [value = <enter_value_here>]"

— Ko.

17

var exists = $("#yourSelect option")
               .filter(function (i, o) { return o.value === yourValue; })
               .length > 0;

Cela a l'avantage d'échapper automatiquement à la valeur pour vous, ce qui rend les guillemets aléatoires dans le texte beaucoup plus faciles à traiter.

— alnorth29
source

2

Cela ne fonctionne pas, vous devez faire ceci:

if ( $("#your_select_id option[value='enter_value_here']").length == 0 ){
  alert("option doesn't exist!");
}

— Mike
source

1

Cela m'aide:

  var key = 'Hallo';

   if ( $("#chosen_b option[value='"+key+"']").length == 0 ){
   alert("option not exist!");

    $('#chosen_b').append("<option value='"+key+"'>"+key+"</option>");
    $('#chosen_b').val(key);
   $('#chosen_b').trigger("chosen:updated");
                         }
  });

— Sulung Nugroho
source

0

J'ai eu un problème similaire. Plutôt que d'exécuter la recherche dans le dom à chaque fois dans la boucle du contrôle select, j'ai enregistré l'élément jquery select dans une variable et j'ai fait ceci:

function isValueInSelect($select, data_value){
    return $($select).children('option').map(function(index, opt){
        return opt.value;
    }).get().includes(data_value);
}

— codeasaurus
source

0

Bien que la plupart des autres réponses aient fonctionné pour moi, j'ai utilisé .find ():

if ($("#yourSelect").find('option[value="value"]').length === 0){
    ...
}

— Strabek
source