jQuery Mobileドロップダウンメニューのオプションを変更し、それを更新します。

Question

私はjQuery Mobile Appを作成しています。 私は、以下のステートメントでドロップダウン選択されたオプションを変更しています： - $（ "＃DataBaseNames"）。val（db）;

私はアラートでチェックしたので、正しいdb値が渡されていると確信しています。 ドロップダウンをドリルダウンすると、正しいテキストが選択されて表示されますが、ドロップダウン自体が正しいテキストを選択して表示していません。

挿入する必要があるリフレッシュコールはありますか？

編集：-Addingフィルの答えはそれを

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

Answer 1

を解決リフレッシュ以下のコードは、カスタムを更新。これは、ネイティブのselect要素のを反映して選択し、カスタムを更新するために使用される

を選択選択項目の オプションの数が カスタムメニューの項目の数と異なる場合、カスタムメニューが再構築されます。また、真の 引数を渡すと、強制的に再構築が実行されます。

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

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

ドキュメント：

• http://jquerymobile.com/demos/1.0rc3/docs/forms/selects/methods.html

Answer 2

私はthis linkをチェックし、それが私のために働きました。これを試してみてください：

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

Answer 3

別のものに基づいて1つのドロップダウンを変更する場合は、これを使用してください。

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