Jak mogę sprawdzić, czy opcja już istnieje w select by JQuery

169

Jak mogę sprawdzić, czy opcja już istnieje w select by JQuery?

Chcę dynamicznie dodawać opcje do select, więc muszę sprawdzić, czy opcja już istnieje, aby zapobiec duplikowaniu.

Pałka policjanta
źródło

Odpowiedzi:

333

Zwraca wartość true, jeśli już istnieje:

$("#yourSelect option[value='yourValue']").length > 0;
Tamas Czinege
źródło
5
Uaktualnianie do Jquery 1.6 +, umieść swoją wartość w cudzysłowie
Bob
1
Tak. Cytaty są bardzo ważne.
bobetko
2
Działa dla mnie w jQuery 1.7.1 bez zamykania twojejValue w cudzysłowie
Mathias F
Jak można w powyższym rozwiązaniu zaimplementować opcję ignore case lub toLowerCase? Czy wymagałoby to $ .each na liście rozwijanej?
Ben Sewards,
1
jeśli chcemy zaimplementować dopasowywanie z uwzględnieniem wielkości liter, co musimy zrobić? użyć prostej funkcji $ .each?
Chaudhry Waqas
21

Inny sposób korzystania z jQuery:

var exists = false; 
$('#yourSelect  option').each(function(){
  if (this.value == yourValue) {
    exists = true;
  }
});
HaMinh Nguyen
źródło
6
-1 W zasadzie sam wykonujesz pętlę zamiast pozwalać jQuery robić to tak, jak wszystkie inne odpowiedzi. Chociaż to by zadziałało, to wymyślenie koła na nowo.
Peter
14
nie jestem pewien, czy jest wart -1. to wyraźnie pokazuje proces, który może być dobry dla początkujących. Z pewnością nie jest to najlepsza odpowiedź, ale jest ważna.
roberthuttinger
1
A niektórzy lubią podejście ręczne, jak ja. Łączy to również krok dodawania wartości boolowskiej, zamiast tworzenia 0 lub 1, jak robi to drugi, i konieczności konwersji. Mówię, że oba podejścia są w porządku, ponieważ w obu przypadkach musisz wykonać 2 kroki. Wydaje mi się, że jest to bardziej widoczne dla procesu i mniej podatne na błędy, jeśli nie oceniam długości białych znaków, na przykład jak .lengthmoże.
vapcguy
3
Plus jeden do tego, także nie musisz się martwić o postacie w yourValue
Fabio C.
1
To i odpowiedź alnort29 są w rzeczywistości najlepszym sposobem sprawdzenia istniejącej wartości, jeśli nie wiesz, czym jest „twojaWartość” (na przykład, czy jest to dane wejściowe użytkownika). Zbudowanie pojedynczego ciągu znaków tylko po to, by pozwolić „jQuery zrobić to”, wymagałoby od nas oczyszczenia danych wejściowych, co prowadzi do praktyk kodu, które nawiedzają SQL od dziesięcioleci. Zatem -1 jest całkowicie nieuzasadnione. Pytanie mówi nawet, że chcą wstawiać wartości „dynamicznie”. Nie łącz ze sobą dynamicznie. Nie robisz też 'wybieraj 1 z użytkowników, dla których hasło = "' + ciąg + '"', prawda?
Aaa
20
if ( $("#your_select_id option[value=<enter_value_here>]").length == 0 ){
  alert("option doesn't exist!");
}
Seb
źródło
2
brakuje nawiasu zamykającego "opcja [wartość = <enter_value_here>]"
KB.
17
var exists = $("#yourSelect option")
               .filter(function (i, o) { return o.value === yourValue; })
               .length > 0;

Ma to tę zaletę, że automatycznie zmienia wartość dla Ciebie, co znacznie ułatwia korzystanie z losowych cudzysłowów w tekście.

alnorth29
źródło
2

Nie działa, musisz to zrobić:

if ( $("#your_select_id option[value='enter_value_here']").length == 0 ){
  alert("option doesn't exist!");
}
mikrofon
źródło
1

Pomóż mi:

  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
źródło
0

Miałem podobny problem. Zamiast przeprowadzać wyszukiwanie w domenie za każdym razem przez pętlę dla kontrolki wyboru, zapisałem element jquery select w zmiennej i zrobiłem to:

function isValueInSelect($select, data_value){
    return $($select).children('option').map(function(index, opt){
        return opt.value;
    }).get().includes(data_value);
}
codeasaurus
źródło
0

Chociaż większość innych odpowiedzi działała u mnie, użyłem .find ():

if ($("#yourSelect").find('option[value="value"]').length === 0){
    ...
}
Strabek
źródło