2015-03-02 215 views
1

我有一個嵌套的JSON這樣的:

[{ 
"1": { 
    "name": "Mobile" 
}, 
"5": { 
    "name": "Savings", 
    "childs": { 
     "27": { 
      "name": "Children" 
     } 
    } 
}, 
"6": { 
    "name": "Pro Expenses" 
}, 
"7": { 
    "name": "Salary", 
    "childs": { 
     "143": { 
      "name": "Salary Savings" 
     } 
    } 
}, 
"8": { 
    "name": "Food", 
    "childs": { 
     "13": { 
      "name": "Lunch Food", 
      "childs": { 
       "53": { 
        "name": "Coffee" 
       } 
      } 
     }, 
     "91": { 
      "name": "Canteen" 
     }, 
     "93": { 
      "name": "Market" 
     } 
    } 
}] 

我想創建一個嵌套的選擇與OPTGROUP和選項是這樣的:

<SELECT> 
<OPTION value="1">Mobile</OPTION> 
<OPTGROUP name="Savings"> 
    <OPTION value="27">Children</OPTION> 
</OPTGROUP> 
<OPTION value="6">Pro Expenses</OPTION> 
<OPTGROUP name="Salary"> 
    <OPTION value="143">Salary Savings</OPTION> 
</OPTGROUP> 
<OPTGROUP name="Food"> 
    <OPTGROUP name="Lunch Food"> 
     <OPTION value="53">Coffee</OPTION> 
    </OPTGROUP> 
    <OPTION value="91">Canteen</OPTION> 
    <OPTION value="93">Market</OPTION> 
</OPTGROUP> 
</SELECT> 

我知道嵌套的OPTGROUP無效。但這不是重點,我想在這裏討論。 ;)

由於每個不支持的第三個參數,下面的我的jquery代碼不工作。

$.getJSON("/?act=get_json_data",{data:'categories'}, function(json) { 
    var select = $('#categories'); 
    $.each(json, function add_optgroup(k, item, parent=select) { 
     if (typeof(item.childs) !== 'undefined') { 
      var group = $('<optgroup>',{label:item.name}); 
      $.each(item.childs, add_optgroup(ck, citem, group)); 
      group.appendTo(parent); 
     } else { 
      $("<option/>",{value:k,text:item.name}) 
        .appendTo(parent); 
     } 
    }); 

我嘗試了很多解決方案,但由於「.appendTo()」中,我需要的家長,每不允許第三個參數。

歡迎任何幫助;)

回答

1

使用另一個嵌套函數來彌合3 ARG函數調用你要和內each回調之間的差距:

$.each(item.childs, function(ck, citem) { add_optgroup(ck, citem, group) }); 

該函數獲得鍵/來自each的值參數,並添加它有權訪問的第三個參數group作爲封閉範圍的一部分。

+0

非常感謝,它像一個魅力! – Kitof 2015-03-02 14:15:35