2016-05-10 94 views
0

我想找到一種方式來填充選項類型,選擇,無線電,texareas,複選框multitiude形式。我發現像jQuery這樣的幾個腳本在這裏填充插件或建議Using jQuery and JSON to populate forms?以及更多堆棧帖子,但是它們都沒有正確處理多維JSON數據。這是JSON數據我處理的小樣本,如何使用多維JSON數據重新填充表單?

var jsonData = { 
    "get_template": "clean", 
    "site_width": "1200px", 
    "layout_type": "full", 
    "main_contained": { 
     "picked": "contained", 
     "notcontained": { 
      "container_contained": "contained" 
     } 
    }, 
    "container_spacing": "25", 
    "columns_spacing": "25", 
    "sidebars_spacing": { 
     "horizontal": "50", 
     "vertical": "50" 
    }, 
    "headers": "menuright", 
    "menu_template": "menuinheader", 
    "toplevel_font": { 
     "font": "Open Sans|600|latin|uppercase|default", 
     "size": "12", 
     "letterspacing": "0", 
     "css": "font-family:'Open Sans',sans-serif;font-weight:600;font-style:normal;font-size:12px;text-transform:uppercase;", 
     "google_font_link": "Open Sans:600&subset=latin" 
    }, 
    "sublevel_font": { 
     "font": "Open Sans|regular|latin|none|default", 
     "size": "14", 
     "letterspacing": "0", 
     "css": "font-family:'Open Sans',sans-serif;font-weight:normal;font-style:normal;font-size:14px;", 
     "google_font_link": "Open Sans:regular&subset=latin" 
    }, 

    "footer_switch": 1, 
    "show_button": { 
     "picked": "hide", 
     "show": { 
      "button": { 
       "button_text": "Load more", 
       "html": "<div class=\"btn-container grid-item-more\"><a class=\"button btn-small radius-4 btn-border-1 align-center btn-trans\" href=\"#\"><span class=\"btn-text fs-13 fw-600\">more</span></a></div>", 
       "json": "{\"createButton\":\"on\",\"buttonTransition\":\"on\",\"buttonAnimation\":false}" 
      } 
     } 
    }, 
    "img-smaller": { 
     "max-width": "260", 
     "max-height": "145" 
    }, 
    "img-xsmall": { 
     "max-width": "120", 
     "max-height": "65" 
    }, 
    "img-related": { 
     "max-width": "350", 
     "max-height": "350" 
    }, 
    "custom_css": 0, 
    "disable_admin_bar": false, 
    "footer_section": { 
     "json": "[{\"type\":\"section\",\"shortcode\":\"section_e603095\",\"width\":\"\",\"_items\":[{\"type\":\"columns\",\"shortcode\":\"columns_a9ae4ee\",\"width\":\"1_3\",\"options\":{\"widget_name\":\"Widget 1\",\"widget_in_boxstyle\":{\"padding\":{\"top\":\"0\",\"right\":\"0\",\"bottom\":\"0\",\"left\":\"0\"}]" 
    } 

}; 

,正如你可以看到形式可以有文字,JSON,布爾等作爲值。

表單輸入名稱的前綴這樣fw_options[link_color]fw_options[main_contained][picked]

如果我的廣告至少找到一個方法來正確地循環通過此JSON重建以正確的方式輸入名字,我可能會得到一個辦法只有檢查輸入類型並設置其值。

任何幫助表示讚賞。

回答

0

不幸的是,代碼將是一團糟,但這裏是你需要做的。

  • 圖如何循環對所有的人,可惜我只能建議的地方你使用模擬變量稱自己與孩子這樣下面的代碼:

    function jsonloop(looper){ //pass in object/array to loop through //code if(lastchild){ //if last child of the lower part upperchild++; //go to next child of upper part jsonloop(upperchild); } }

  • 使用instanceof檢查類型:

    if(json instanceof Array){ for(var item in json){ var jsonarray = json[item]; //do stuff } } else if(json instance of Object){ for(var item in json){ var jsonobject = json[item]; //do different stuff like below for(var name in jsonobject){ //loop through object properties //do other stuff } } }

這是所有的模擬代碼!

不要使用它,它不會很好地結束。注意:最終的結果可能是半大規模的,因爲這樣的東西,如"json": [{}]其中既是一個對象又是一個數組,並且你的代碼將被炸。這裏有一些很好的資源:

祝你好運。我很抱歉,我無法建立更多。