2011-11-16 25 views
13

Estoy escribiendo la aplicación jQuery Mobile. Estoy cambiando la opción seleccionada desplegable a través de la declaración siguiente: - $ ("# DataBaseNames"). Val (db);jQuery Mobile Cambiar la opción seleccionada DropDown y actualizarla

Estoy seguro de que se aprobó el valor correcto de la base de datos, ya que lo revisé mediante alerta. Cuando abro el menú desplegable, también muestra el texto correcto seleccionado, pero el menú desplegable no muestra el texto correcto como está seleccionado.

¿Alguna llamada de actualización que necesito insertar?

Editar: -Adición código, por debajo de respuesta de Phill lo resolvió actualizar

<script type="text/javascript"> 

     $("#@ViewBag.DivTitle").live('pageshow', function() { 

      var db = getCookie("DataBaseNames"); 

      $("#DataBaseNames").val(db);    
      $("#DataBaseNames option[value='"+ db + "']").attr("selected", "selected"); 

      //  refresh value , Following is what is required   
      $('select').selectmenu('refresh'); 

      $("#cmdLogOn").live("click", function() { 
       var dbSelected = $("#DataBaseNames option:selected").text();    
       setCookie('DataBaseNames', dbSelected); 
      }); 
     }); 

     function setCookie(name, value) { 
      var expires = ""; 
      document.cookie = name + "=" + value + expires + "; path=/"; 
     } 

     function getCookie(name) { 
      var nameEQ = name + "="; 
      var ca = document.cookie.split(';'); 
      for (var i = 0; i < ca.length; i++) { 
       var c = ca[i]; 
       while (c.charAt(0) == ' ') c = c.substring(1, c.length); 
       if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length); 
      } 
      return null; 
     } 
    </script> 
+0

El código sería agradable de ver, por favor edite su pregunta y agregue un código de ejemplo. Tal vez http://jsfiddle.net –

Respuesta

35

actualización de la costumbre seleccionar

Esto se utiliza para actualizar la costumbre seleccionar para reflejar el selecto del elemento nativo valor.Si la cantidad de opciones en la selección es diferente de la cantidad de elementos en el menú personalizado , se reconstruirá el menú personalizado. Además, si pasa un argumento verdadero , puede forzar la reconstrucción para que ocurra.

//refresh value   
$('select').selectmenu('refresh'); 

//refresh and force rebuild 
$('select').selectmenu('refresh', true); 

Docs:

+0

¡gracias por señalar esto! – vaske

+0

me salvó el día !!!! – sony

2

he comprobado this link y lo encontró trabajando para mí. Pruebe esto:

var myselect = $("select#YourDropdownID"); 
myselect[0].selectedIndex =0; 
myselect.selectmenu("refresh"); 
0

Si desea cambiar un menú desplegable en función de otro, utilice esto.

<link href="code.jquery.com/mobile/1.4.1/jquery.mobile-1.4.1.min.css" rel="stylesheet"/> 
<link href="jquery/css/index.css" rel="stylesheet"/> 
<link href="../favicon.ico" rel="shortcut icon"/> 
<link href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,700" rel="stylesheet"/> 
<link href="http://code.jquery.com/mobile/1.4.1/jquery.mobile-1.4.1.min.css" rel="stylesheet" /> 
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.4.1/jquery.mobile-1.4.1.min.js"></script> 

<script type="text/javascript"> 

    function ItemNo() 
    { 
    var no = $('#sltItemNo')[0].selectedIndex; 

    var myselect = $("select#sltItemName"); 
    myselect[0].selectedIndex =no; 
    myselect.selectmenu("refresh"); 
    } 
    function ItemName() 
    { 
    var no = $('#sltItemName')[0].selectedIndex; 

    var myselect = $("select#sltItemNo"); 
    myselect[0].selectedIndex =no; 
    myselect.selectmenu("refresh"); 
    } 

</script> 

<select id="sltItemNo" onchange="ItemNo()" data-shadow="false" data-mini="true"> 
    <option value="Abc">1</option> 
    <option value="Cde">2</option> 
    <option value="Efg">3</option> 
</select> 

<select id="sltItemName" onchange="ItemName()" data-shadow="false" data-mini="true"> 
    <option value="1">Abc</option> 
    <option value="2">Cde</option> 
    <option value="3">Efg</option> 
</select> 
Cuestiones relacionadas