JQMで前回の選択値に基づいて選択オプションを変更する

Question

最初の選択ドロップダウンに基づいて2番目の選択ドロップダウンのオプションを変更したいと考えています。私はこれを通常の古いJSでやったことがありますが、私はJQMでそれをやるより良い方法を望んでいました。

私は、すべてのオプションを使用してオブジェクトを持っている。このように：

var options = { 
    blah1: ["A", "B", "C"], 
    blah2: ["D", "E", "F"], 
    blah3: ["G", "G", "I"] 
}; 

私はこれらの選択入力があります。ここでは

<select value="firstSelect"> 
    <option value="blah1">Blah1</option> 
    <option value="blah2">Blah2</option> 
    <option value="blah3">Blah3</option> 
</select> 

<select value="secondSelect"> 
</select> 

は、私は現在、私のmain.JSに持っているものです。

$('#firstSelect').change(function() { 
    var x= $('#secondSelect').val() 
    for(index in options[x]) { 
     $('#secondSelect').append('<option value="' + options[x][index] + '">' + options[x][index] + '</option>') 
    }; 
}); 

最初の選択ドロップダウンでblah1を選択すると、2番目の選択ドロップダウンにoptio ns.blah1の値。その後、blah2とblah3と同じです。それが私が働きかけようとしている考えです。

私はJQMを使用しないでこれと同じバージョンの作業をしましたが、今は分かりません。 誰でもこれを手助けできますか？

ありがとうございます。

編集：私はそれを理解しました！ブロック全体を閉じる前に、最後に$('#secondSelect').selectmenu('refresh', true);を追加する必要がありました。それは働いていた、私はそれを更新するために2番目の選択ドロップダウンを更新する必要があった。これが誰かを助けることを望みます。

ところで、自分の疑問に答えることができないので、この編集を追加しました。誰でも自由に答えることができます。

Answer 1

基本的には、多くのものに間違った名前が付けられました。 HTMLにidの代わりにvalueを使用しました。 firstSelectの代わりにval()がsecondSelectになっています。

HTML

<select id="firstSelect"> 
<option value="blah1">Blah1</option> 
<option value="blah2">Blah2</option> 
<option value="blah3">Blah3</option> 
</select> 

<select id="secondSelect"> 
</select>​ 

Javascriptを

var options = { 
    blah1: ["A", "B", "C"], 
    blah2: ["D", "E", "F"], 
    blah3: ["G", "G", "I"] 
}; 

$(function() { 
    $('#firstSelect').change(function() { 
     var x = $('#firstSelect').val() 
     for (var index in options[x]) { 
      $('#secondSelect').append('<option value="' + options[x][index] + '">' + options[x][index] + '</option>') 
     }; 
    }); 
});​ 

Answer 2

あなたのコードに多少の誤差であること、[OK]を...

1. まず、あなたの選択の要素は、ID属性を持っていません"ids"を値
という名前の属性に挿入します
2. 第2に、あなたのjavas cript関数を使用すると、select1から選択された値を間違った方法で取得しようとしています...正しい形式は$('#firstSelect :selected').val()
3. です。最後に、.append()メソッドを使用すると、古いhtmlは消去されません。 .append()メソッドを使用する前に、ここで

は、機能の例とjsfiddleです... .html("")を使用しています。