2017-10-13 7 views
-1

ajaxデータからオプションとオプショングループを動的に追加します。 Ajaxのデータからjqueryを使用して選択ボックスにオプショングループとオプションを動的に追加します。

<select name="catsndogs"> 
    <optgroup label="Cats"> 
     <option>Tiger</option> 
     <option>Leopard</option> 
     <option>Lynx</option> 
    </optgroup> 
</select> 

私は見出しとして「小」、「正規」を追加する必要がありますが、正規の下で、私はサイズのスモールそれリストの下のリストをするアレイ

{ 
    Regular: [ 
    "S", 
    "XS", 
    "M" 
    ], 
    Small: [ 
    "em" 
    ] 
} 

のこのリストを持っています彼らのサイズは、 のようにここにhttp://jsfiddle.net/sushilbharwani/Xp8YK/

しかし、これを行う必要があります...誰も私を解決するのを助けることができますか?

答えて

0

あなたがアヤックスから戻ってきているJSONがjson1であると仮定すると、それはこの

$(document).ready(function() { 
 
    
 
var $cont = $('select'); 
 
var json1 = {"Regular": ["S", "XS", "M"],"Small": ["em"]}; 
 
    for(var i=0;i<Object.keys(json1).length;i++){ 
 
\t \t var a = '<optGroup label = '+Object.keys(json1)[i]+'>'; 
 
     for(var j=0;j<json1[Object.keys(json1)[i]].length;j++){ 
 
     a = a+'<option>' + json1[Object.keys(json1)[i]][j] +'</option>' 
 
     } 
 
    $(a).appendTo($cont) 
 
    } 
 
    
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"> 
 
</script> 
 
<body> 
 
<select> 
 

 
</select> 
 
</body>

のように行うことができますに
関連する問題