json配列要素を選択タグに動的に表示する方法は？

Question

私はこの

"StoreName":["10001 Main ST","10002 Part1","10004 MyStore1","10005 M STR",  "10008 Centro","10009 MyStore 02","1001 G","1001 H","10010 Store main ROAD","10011 Central M Store","10012 En Department","10013 M Station","10014 Test Center","10015 SubStore1","10016 AA","10018 M part #","10019 Test A - 26032016","1002 B","1002 I","10020 Test Central B "] 

のような形式のJSON配列を持っていると私はそれの各要素にアクセスし、

<select id ="storeNm" name="name"> 
    <option>--Select--</option> 
    <option>---Here store name list contents---</option> 
    <option>---Here store name list contents---</option> 
</select> 

としてselectタグのオプションの中にそれを表示する必要があり、私はJSONに新しいですし、任意のヘルプ/ガイダンスが評価されるように、javascript/jQueryを使用してそれを行う必要があります。

Answer 1

Array#mapメソッドを使用して要素を反復して生成します。要素はgenerate using jQueryとすることができます。あなたのリストをループする

var data = { 
 
    "StoreName": ["10001 Main ST", "10002 Part1", "10004 MyStore1", "10005 M STR", "10008 Centro", "10009 MyStore 02", "1001 G", "1001 H", "10010 Store main ROAD", "10011 Central M Store", "10012 En Department", "10013 M Station", "10014 Test Center", "10015 SubStore1", "10016 AA", "10018 M part #", "10019 Test A - 26032016", "1002 B", "1002 I", "10020 Test Central B "] 
 
}; 
 

 
// create select tag 
 
$('<select/>', { 
 
    // set id of the element 
 
    id: 'storenm', 
 
    // generate html content by iterating over array 
 
    html: data.StoreName.map(function(v) { 
 
     // generate option with value and text content 
 
     return $('<option>', { 
 
     text: v, 
 
     value: v 
 
     }); 
 
    }) 
 
    // append the generated tag to body 
 
}).appendTo('body');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>