dojo小例子(12)form轉換成帶內部物件的json資料
阿新 • • 發佈:2019-02-12
假設有這樣一個form
我們希望提交時把整個form表單轉換為json,同時phone轉換為json的內部物件,就是這種格式<div id="myform" data-dojo-type="dijit/form/Form"> <div>姓名<input name="name" data-dojo-type="dijit/form/TextBox" /></div> <div>年齡<input name="age" data-dojo-type="dijit/form/TextBox" /></div> <div>辦公電話<input name="phone.company" data-dojo-type="dijit/form/TextBox" /></div> <div>家庭電話<input name="phone.home" data-dojo-type="dijit/form/TextBox" /></div> <div>個人電話<input name="phone.private" data-dojo-type="dijit/form/TextBox" /></div> <button id='btn' data-dojo-type="dijit/form/Button" onclick="submit()">提交</button> </div>
{"name":"陳","age":"24","phone":{"company":"123","home":"456","private":"789"}}
這樣通過rest方式,可以直接對映json到vo物件中
public class Persion{
private String name;
private String age;
private Map phone = new HashMap();
}
json到vo的對映是後臺部分。頁面dojo實現form到json的轉換是這樣的:
require(["dojo/request/xhr", "dojo/dom-form", "dojo/json"], function(xhr, domForm, JSON) { var val = JSON.stringify(dijit.byId("myform").get('value')); // form到json轉換 xhr.post("url", { headers: { 'Content-Type': 'application/json; charset=UTF-8' }, handleAs: "json", data: val // json }).then(function(data) { // sucess }, function(err) { // fail }); });
需要注意的是,必須用JSON.stringify(dijit.byId("myform").get('value'))這種方式才能轉換成想要的json格式。domForm.toJson("myform")或者JSON.stringify(domForm.toObject("myform"))轉換出來都是這種結果
{"name":"陳","age":"24","phone.company":"123","phone.home":"456","phone.private":"789"}}