javascript fill optogroupedドロップダウン

Question

私はsilverstripe関数から配列を返すAjax呼び出しを持っています。

{ 
    "null":"-- Person/choose Email --", 
    "System":{ 
     "default":"donald@duckburg.com"}, 
    "Office":{ 
     "21":"daisy@duckburg.com", 
     "22":"dagobert@duckburg.com", 
     "23":"donald@duckburg.com", 
     "24":"goofy@duckburg.com" 
     }, 
    "Workshop":{ 
     "22":"dagobert@duckburg.at" 
     } 
} 

オプショングループ化されたドロップダウンを成功させようとしています。

$.ajax({ 
    url: "StringImage_Ajax/dropdownSource", 
    type: "POST", 
    dataType: "json", 
    async:false 
}).done(function(data){ 
    dddata = JSON.stringify(data.string); 
    console.log('data = ' + dddata); 
    var dropdown = $('#StringEmail'); 

    /*$.each(dddata, function (key, cat) { 
     console.log(key + ' _ ' + cat); 
     var group = $('<optgroup>',{label:key}); 
     $.each(cat,function(i,item) { 
      $("<option/>",{value:item.id,text:item.name}) 
       .appendTo(group); 
     }); 
     group.appendTo(dropdown); 
    });*/ 

}); 

は、どのように各ました - 機能が正しく動作するように変更するには？

ありがとうございます。

UPDATE：@Endless動作するコードに

感謝：

var dropdown = $('#StringEmail').empty(); 

       $.each(dddata, function (key, cat) { 
        if (typeof cat === 'string') { 
         $('<option/>', {value:key,text:cat}).appendTo(dropdown) 
         return 
        } 
        var group = $('<optgroup>', {label: key}); 

        $.each(cat, function(value, text) { 
         $("<option/>", {value:value,text:text}).appendTo(group); 
        }); 
        group.appendTo(dropdown); 
       }); 

Answer 1

AJAX一部を表示する必要は

が、とにかく...あなたはほとんどそれを得ました。

var dropdown = $("<select>") 

$.each(dddata, function (key, cat) { 
    if (typeof cat === 'string') { 
    $('<option disabled>', {text: cat}) 
    .appendTo(dropdown) 
    return 
    } 

    var group = $('<optgroup>', {label: key}) 

    $.each(cat, function(value, text) { 
    $('<option>', {value, text}) 
    .appendTo(group); 
    }); 

    group.appendTo(dropdown); 
})