¿Cómo puedo establecer el valor de DropDownList usando jQuery?

Question

Como dice la pregunta, ¿cómo puedo establecer el valor de un control DropDownList usando jQuery?

Answer 1

$("#mydropdownlist").val("thevalue"); 

solo asegúrese de que el valor en las etiquetas de opciones coincida con el valor en el método val.

Answer 2

Si se trabaja con el índice, puede definir el índice seleccionado directamente con .attr():

$("#mydropdownlist").attr('selectedIndex', 0); 

Esto fijará al primer valor de la lista desplegable.

Editar: La forma en que lo hice anteriormente solía funcionar. Pero parece que ya no es así.

Pero como Han señala tan gratamente en los comentarios, la forma correcta de hacerlo es:

$("#mydropdownlist").get(0).selectedIndex = index_here; 

Answer 3

probar este enfoque muy simple:

/*make sure that value is included in the options value of the dropdownlist 
e.g. 
(<select><option value='CA'>California</option><option value='AK'>Alaska</option>  </select>) 
*/ 

$('#mycontrolId').val(myvalue).attr("selected", "selected"); 

Answer 4

Si su desplegable es Asp.Net desplegable a continuación, por debajo de código funciona bien,

$("#<%=DropDownName.ClientID%>")[0].selectedIndex=0; 

Pero si su desplegable está HTML desplegable a continuación, este código será w ork.

$("#DropDownName")[0].selectedIndex=0; 

Answer 5

Creo que esto puede ayudar a:

$.getJSON('<%= Url.Action("GetDepartment") %>', 
       { coDepartment: paramDepartment }, 
       function(data) { 
        $(".autoCompleteDepartment").empty(); 
        $(".autoCompleteDepartment").append($("<option />").val(-1)); 
        $.each(data, function() { 
         $(".autoCompleteDepartment").append($("<option />").val(this.CodDepartment).text(this.DepartmentName)); 
        }); 
        $(".autoCompleteDepartment").val(-1);          
       } 
      ); 

Si lo hace de esta manera, se agrega un elemento sin texto. Por lo tanto, cuando hace clic en combo, no aparece, pero el valor -1 que agregó posteriormente selecciona $ (". AutoCompleteDepartment"). Val (-1); le permite controlar si el combo tiene un valor válido.

Espero que ayude a cualquiera.

Lo siento por mi inglés.

Answer 6

En caso de que cuando se carga toda <options ....></options> por el Ajax llaman
Siga estos pasos para hacer esto.

1). Crear un método separado para el valor conjunto de desplegable
Para Ex:

function set_ip_base_country(countryCode) 
    $('#country').val(countryCode) 
} 

2).Llamar a este método cuando ajax éxito guardia toda la tarea html append completa

Por Ej:

success: function (doc) { 
    ..... 
    ..... 
    $("#country").append('<option style="color:black;" value="' + key + '">' + value + '</option>') 
    set_ip_base_country(ip_base_country) 
} 

Answer 7

Aquí es una función hecha para configurar rápidamente la opción seleccionada:

function SetSelected(elem, val){ 
     $('#'+elem+' option').each(function(i,d){ 
     // console.log('searching match for '+ elem + ' ' + d.value + ' equal to '+ val); 
      if($.trim(d.value).toLowerCase() == $.trim(val).toLowerCase()){ 
     //  console.log('found match for '+ elem + ' ' + d.value); 
       $('#'+elem).prop('selectedIndex', i); 
      } 
     }); 
    } 

llamar a esta función con el argumento identificación del elemento y valor seleccionado; como este:

SetSelected('selectID','some option'); 

Es útil cuando hay muchas opciones de selección para establecer.

Answer 8

Según lo sugerido por @ Nick Berardi, si su valor cambiado no se refleja en la parte delantera de interfaz de usuario, intente:

$("#mydropdownlist").val("thevalue").change(); 

Answer 9

Probar:

jQuery("#availability option:selected").val(); 

O para obtener el texto de la opción, use el texto():

jQuery("#availability option:selected").text(); 

Más información:

http://api.jquery.com/val/ 
http://api.jquery.com/text/ 

$(document).ready(function(){ 
 
    $('#button1').click(function(){ 
 
    alert($('#combo :selected').text()); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="combo"> 
 
    <option value="1">Test 1</option> 
 
    <option value="2">Test 2</option> 
 
</select> 
 
<input id="button1" type="button" value="Click!" />

Answer 10

Hay muchas maneras de hacerlo. Aquí están algunos de ellos:

$("._statusDDL").val('2'); 

O

$('select').prop('selectedIndex', 3); 

En este artículo hay diferentes maneras de Select drop down value using Jquery.

Answer 11

Conjunto drop-downselected valor y la actualización cambia

$("#PR2DistrictId option[value='@Model.PR2DistrictId']").attr("selected", true).trigger("chosen:updated") 

Aquí nos fijamos primer valor de Model y que actualizamos el elegido

Answer 12

// formato HTML de la lista desplegable.

<select id="MyDropDownList"> 
<option value=test1 selected>test1</option> 
<option value=test2>test2</option> 
<option value=test3>test3</option> 
<option value=test4>test4</option> 

// Si desea cambiar el elemento seleccionado a test2 usando javascript. Prueba este. // conjunto la siguiente opción u desea seleccionar

var NewOprionValue = "Test2" 

     var RemoveSelected = $("#MyDropDownList")[0].innerHTML.replace('selected', ''); 
     var ChangeSelected = RemoveSelected.replace(NewOption, NewOption + 'selected>'); 
     $('#MyDropDownList').html(ChangeSelected); 

Answer 13

mejor respuesta para la pregunta:

$("#comboboxid").val(yourvalue).trigger("chosen:updated"); 

correo.g:

$("#CityID").val(20).trigger("chosen:updated"); 

o

$("#CityID").val("chicago").trigger("chosen:updated");