¿Cómo puedo verificar si ya existe una opción en select by JQuery

169

¿Cómo puedo verificar si ya existe una opción en select by JQuery?

Quiero agregar dinámicamente opciones en select y, por lo tanto, debo verificar si la opción ya existe para evitar la duplicación.

Porra
fuente

Respuestas:

333

Esto se evalúa como verdadero si ya existe:

$("#yourSelect option[value='yourValue']").length > 0;
Tamas Czinege
fuente
55
Actualizando a Jquery 1.6 +, incluya su Valor entre comillas
Bob
1
Sí. Las cotizaciones son muy importantes.
bobetko
2
Funciona para mí en jquery 1.7.1 sin incluir su valor entre comillas
Mathias F
¿Cómo se puede implementar el caso ignorado o toLowerCase en la solución anterior? ¿Esto requeriría $ .cada para la lista desplegable?
Ben Sewards
1
si queremos implementar una coincidencia entre mayúsculas y minúsculas, ¿qué tenemos que hacer? usa la simple función $ .each?
Chaudhry Waqas
21

Otra forma de usar jQuery:

var exists = false; 
$('#yourSelect  option').each(function(){
  if (this.value == yourValue) {
    exists = true;
  }
});
HaMinh Nguyen
fuente
66
-1 Básicamente estás haciendo el ciclo tú mismo en lugar de dejar que jQuery lo haga como todas las otras respuestas. Aunque esto funcionaría, está reinventando la rueda.
Peter
14
No estoy seguro de que sea -1 digno. Esto muestra explícitamente el proceso, que puede ser bueno para los principiantes. Ciertamente no es la mejor respuesta, pero es válida.
roberthuttinger
1
Y a algunos les gusta el enfoque manual, como a mí. Esto también combina el paso de agregar el booleano allí, en lugar de producir el 0 o 1 como lo hace el otro y tener que convertirlo. Digo que ambos enfoques están bien porque tienes que hacer 2 pasos, de cualquier manera. Esto parece más visible para el proceso, para mí, y menos propenso a errores al no juzgar la longitud del espacio en blanco, por ejemplo, como .lengthpodría hacerlo.
vapcguy
3
Además de uno para estos, tampoco necesita preocuparse por los personajes en su Valor
Fabio C.
1
Esta y la respuesta de alnort29 son en realidad la mejor manera de verificar un valor existente, si no sabe qué es "yourValue" (por ejemplo, si es una entrada del usuario). Construir una sola cadena solo para permitir que "jQuery lo haga" requeriría que realice la desinfección de entrada, y terminará con prácticas de código que han obsesionado a SQL durante décadas. Entonces un -1 es completamente injustificado. La pregunta incluso afirma que quieren insertar valores "dinámicamente". No parches tu cadena de forma dinámica. Tampoco haces 'selecciona 1 de los usuarios donde contraseña = "' + cadena + '"', ¿verdad?
Aaa
20
if ( $("#your_select_id option[value=<enter_value_here>]").length == 0 ){
  alert("option doesn't exist!");
}
Seb
fuente
2
le falta un corchete de cierre "option [value = <enter_value_here>]"
KB.
17
var exists = $("#yourSelect option")
               .filter(function (i, o) { return o.value === yourValue; })
               .length > 0;

Esto tiene la ventaja de escapar automáticamente del valor para usted, lo que hace que las citas aleatorias en el texto sean mucho más fáciles de tratar.

alnorth29
fuente
2

No funciona, tienes que hacer esto:

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

Me ayuda:

  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
fuente
0

Tuve un problema similar En lugar de ejecutar la búsqueda a través del dom cada vez que el ciclo para el control select guardé el elemento jquery select en una variable e hice esto:

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

Aunque la mayoría de las otras respuestas funcionaron para mí, utilicé .find ():

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