JQuery AJAXリクエスト（jsonオブジェクトとして）を使用してドロップダウンリストにオプションを追加

Question

現在、JQueryに取り掛かり、より具体的にはAJAXリクエストを取得しようとしています。

コード：
Javascriptを：

success: function(json) { 
     console.log(json); 
     var $el = $("#system"); 
     $el.empty(); // remove old options 
     $el.append($("<option></option>") 
      .attr("value", '').text('Please Select')); 

     // for each set of data, add a new option 
     $.each(json, function(value, key) { 
      $el.append($("<option></option>") 
       .attr("value", value).text(key)); 
     }); 

}, 

HTML：

<form id="filter"> 
    <label for="datepicker"> 
     Date: <input id="datepicker" onchange="updateSystems()" type="text" /> 
    </label> 
    &nbsp; 
    <label>from: 
     <select id="timespan-from" name="timespan-from" onchange="updateSystems()" size="1"> 
      <option value="0">0 Uhr</option> 
      ... 
      <option value="23">23 Uhr</option> 
     </select> 
    </label> 
    &nbsp; 
    <label>to: 
     <select id="timespan-to" name="timespan-to" onchange="updateSystems()" size="1"> 
      <option value="0">23 Uhr</option> 
      ... 
      <option value="0">0 Uhr</option> 
     </select> 
    </label> 
    &nbsp; 
    <label>in System: 
     <select id="system" name="system" size="1"> 
      <!-- this should be updated --> 
      <option>Amarr</option> 
      <option>JEIV-E</option> 
      <option>Jita</option> 
      <option>Litom</option> 
      <option>Penis</option> 
     </select> 
    </label> 
</form> 

この機能は、私は私の文書のフィールドを変更するたびに、トリガー とhtmlの要素を更新する必要がありますされます落ちる。

AJAXリクエストは機能しますが、dropdown-updateは意図したとおりに機能しません。私はと<select>ドロップダウンに<option>フィールドを追加しようとしています。

しかし、結果のドロップダウンが常に次のようになります。

• [オブジェクトのオブジェクト]

を選択してくださいどのようなので、変更することが私の機能を必要とすることは、私のドロップダウンに私のJSONデータを追加しますメニュー？私のPHPスクリプトから

例JSONのリターン：

[ 
    { 
        "solarSystemID": "30001171", 
        "solarSystemName": "F4R2-Q" 
    }, 
    { 
        "solarSystemID": "30001182", 
        "solarSystemName": "MB-NKE" 
    }, 
    { 
        "solarSystemID": "30004299", 
        "solarSystemName": "Sakht" 
    }, 
    { 
        "solarSystemID": "30004738", 
        "solarSystemName": "1-SMEB" 
    } 
] 

solarSystemIDが solarSystemName
は、テキストである必要があり、<option>の値になるはずです。

事前にお手伝いをしていただきありがとうございます。最終的に意図した通りに作業を進めるには、正しい方向に少し押してください。

Answer 1

ソーラーオブジェクトをオプション要素にマップするマップメソッドを使用できます。

$('#system').append(json.map(function(sObj){ 
    return '<option id="'+sObj.solarSystemID+'">'+ sObj.solarSystemName +'</option>' 
}));