使用servlet测试
后台数据为:返回类型没有设置(方式一)
1 String str = "["+ 2 "{ id:1, pId:0, name:"可折腾的父节点 1", t:"我很普通,随便 展开/折叠 我吧", open:false},"+ 3 "{ id:11, pId:1, name:"叶子节点 - 1", t:"我老爸很普通,随便折腾他吧"},"+ 4 "{ id:12, pId:1, name:"可折腾的父节点 2", t:"我和我老爸都很普通,随便折腾我和他吧", open: false},"+ 5 "{ id:121, pId:12, name:"父节点 - 121", t:"我老爸很普通,随便折腾他吧", open:true},"+ 6 "{ id:1211, pId:121, name:"父节点 - 1211", t:"我老爸很普通,随便折腾他吧", open:false},"+ 7 "{ id:1212, pId:1211, name:"叶子节点 - 1212", t:"我老爸很普通,随便折腾他吧"},"+ 8 "{ id:1213, pId:121, name:"父节点 - 1213", t:"我老爸很普通,随便折腾他吧", open:false},"+ 9 "{ id:1214, pId:1213, name:"叶子节点 - 1214", t:"我老爸很普通,随便折腾他吧"},"+ 10 "{ id:123, pId:12, name:"叶子节点 - 23", t:"我老爸很普通,随便折腾他吧"},"+ 11 "{ id:13, pId:1, name:"叶子节点 - 3", t:"我老爸很普通,随便折腾他吧"},"+ 12 "{ id:2, pId:1, name:"无法折叠的父节点", t:"休想让我折叠起来...除非你用 expandAll 方法", open:false, collapse:false},"+ 13 "{ id:21, pId:2, name:"叶子节点2 - 1", t:"哈哈哈,我老爸NB吧,不能折叠吧?"},"+ 14 "{ id:22, pId:21, name:"叶子节点2 - 2", t:"哈哈哈,我老爸NB吧,不能折叠吧?"},"+ 15 "{ id:23, pId:21, name:"叶子节点2 - 3", t:"哈哈哈,我老爸NB吧,不能折叠吧?"},"+ 16 "{ id:3, pId:2, name:"无法展开的父节点", t:"就凭你也想展开我?难呀...嘿嘿, 除非你用 expandAll 方法", open:false, expand:true},"+ 17 "{ id:31, pId:3, name:"叶子节点3 - 1", t:"居然让你看到了...莫非你用了全部节点展开?"},"+ 18 "{ id:32, pId:31, name:"叶子节点3 - 2", t:"居然让你看到了...莫非你用了全部节点展开?"},"+ 19 "{ id:33, pId:31, name:"叶子节点3 - 3", t:"居然让你看到了...莫非你用了全部节点展开?"},"+ 20 "{ id:4, pId:3, name:"空空的父节点 1", t:"一无所有...除了我自己", isParent:true, open:false}"+ 21 "]";
前端使用$.post接收,没有问题,能够加载出树结构
1 $.POST('/TestServlet',{},function(data){ 2 var nodes = eval("("+data+")"); 3 $.fn.zTree.init($("#tree"), setting, nodes); 4 });
使用ajax接收,配置呢type为json,会提示加载失败
1 $.ajax({ 2 type: "POST", 3 url: '/TestServlet', 4 timeout: 1000, 5 data: { 6 key1: "value1", 7 key2: "value2" 8 }, 9 async: true, 10 dataType: "json", 11 error: function(){ 12 alert("请求失败!"); 13 }, 14 success: function(data){ 15 treeObj = $.fn.zTree.init($("#tree"), setting, data); 16 } 17 });
见后端的字符串修改:键上加了引号(方式二)
1 String str = "["+ 2 "{ "id":1, "pId":0, "name":"可折腾的父节点 1", "t":"我很普通,随便 展开/折叠 我吧", "open":true},"+ 3 "{ "id":11, "pId":1, "name":"叶子节点 - 1", "t":"我老爸很普通,随便折腾他吧"},"+ 4 "{ "id":12, "pId":1, "name":"可折腾的父节点 2", "t":"我和我老爸都很普通,随便折腾我和他吧", "open": false},"+ 5 "{ "id":121, "pId":12, "name":"父节点 - 121", "t":"我老爸很普通,随便折腾他吧", "open":true},"+ 6 "{ "id":1211, "pId":121, "name":"父节点 - 1211", "t":"我老爸很普通,随便折腾他吧", "open":false},"+ 7 "{ "id":1212, "pId":1211, "name":"叶子节点 - 1212", "t":"我老爸很普通,随便折腾他吧"},"+ 8 "{ "id":1213, "pId":121, "name":"父节点 - 1213", "t":"我老爸很普通,随便折腾他吧", "open":false},"+ 9 "{ "id":1214, "pId":1213, "name":"叶子节点 - 1214", "t":"我老爸很普通,随便折腾他吧"},"+ 10 "{ "id":123, "pId":12, "name":"叶子节点 - 23", "t":"我老爸很普通,随便折腾他吧"},"+ 11 "{ "id":13, "pId":1, "name":"叶子节点 - 3", "t":"我老爸很普通,随便折腾他吧"},"+ 12 "{ "id":2, "pId":1, "name":"无法折叠的父节点", "t":"休想让我折叠起来...除非你用 openAll 方法", "open":false, "collapse":false},"+ 13 "{ "id":21, "pId":2, "name":"叶子节点2 - 1", "t":"哈哈哈,我老爸NB吧,不能折叠吧?"},"+ 14 "{ "id":22, "pId":21, "name":"叶子节点2 - 2", "t":"哈哈哈,我老爸NB吧,不能折叠吧?"},"+ 15 "{ "id":23, "pId":21, "name":"叶子节点2 - 3", "t":"哈哈哈,我老爸NB吧,不能折叠吧?"},"+ 16 "{ "id":3, "pId":2, "name":"无法展开的父节点", "t":"就凭你也想展开我?难呀...嘿嘿, 除非你用 openAll 方法", "open":false, "expand":true},"+ 17 "{ "id":31, "pId":3, "name":"叶子节点3 - 1", "t":"居然让你看到了...莫非你用了全部节点展开?"},"+ 18 "{ "id":32, "pId":31, "name":"叶子节点3 - 2", "t":"居然让你看到了...莫非你用了全部节点展开?"},"+ 19 "{ "id":33, "pId":31, "name":"叶子节点3 - 3", "t":"居然让你看到了...莫非你用了全部节点展开?"},"+ 20 "{ "id":4, "pId":3, "name":"空空的父节点 1", "t":"一无所有...除了我自己", "isParent":true, "open":false}"+ 21 "]";
且设置返回值类型:
response.setContentType("application/json; charset=utf-8");
就可以使用ajax设置type为json接收数据。
注意:后台设置json格式返回时,键上要加引号。如果键上没加引号,但是又设置呢返回值为json,通过浏览器,可以正常加载出数据,但是在使用ajax请求时,会失败。