您的位置:首页 > Web前端 > JQuery

jQuery树插件zTree.js如何应用后台返回的不标准数据

2016-09-13 11:47 381 查看
应用zTree插件,有2种数据格式,一种是标准数据,一种是简单数据,具体请看下面不能直接应用的数据示例:

1. 后台返回标准json数据但是不能直接应用:

原因:应用ztree,json数据必须要有name和children字段,参见:view-source:http://www.treejs.cn/v3/demo/cn/core/standardData.html

不能直接应用数据如下:

{
"code": 200,
"message": "操作成功",
"data": [
{
"id": 107,
"name": "测试不通过(给开发人员)",
"createData": 1472441685,
"createUserId": 1,
"webId": 1,
"postUsers": [
{
"id": 3,
"code": "x",
"password": "123123",
"email": "fuxiaodong@iyunwen.com",
"mobilePhone": "18655558888",
"createData": 1472441686,
"createUserId": 1,
"webId": 1,
"roleId": 101
}
]
},
{
"id": 105,
"name": "验收",
"createData": 1472441685,
"createUserId": 1,
"webId": 1,
"postUsers": [
{
"id": 4,
"code": "xx",
"password": "123123",
"email": "meiaohan@iyunwen.com",
"mobilePhone": "18655558888",
"createData": 1472441686,
"createUserId": 1,
"webId": 1,
"roleId": 101
},
{
"id": 2,
"code": "xxx",
"password": "123123",
"email": "wangdewei@iyunwen.com",
"mobilePhone": "18655558888",
"createData": 1472441686,
"createUserId": 1,
"webId": 1,
"roleId": 101
}
]
}
]
}


解决方法:

Base.request({
url: '...',
params: {
webId: 1
},
callback: function(data) {
if(data.data) {
var html ='';
if(data.data[0]) {
var formatData = [],
len = data.data.length;

for(var p in data.data) {
formatData[p] = {};
formatData[p]['children'] = [];
formatData[p]['name'] = data.data[p].name;
for(var c in data.data[p].postUsers) {
formatData[p]['children'][c] = {};
formatData[p]['children'][c]['name'] = data.data[p].postUsers[c].code;
formatData[p]['children'][c]['my_id'] = data.data[p].postUsers[c].id;
}
}

var treeData = [];
treeData[0] = {};
treeData[0]['name'] = '所有岗位';
treeData[0]['children'] = formatData;
treeData[0]['open'] = true;

$.fn.zTree.init($("#ztree"), setting, treeData);
}else {

}
}else {
layer.msg(data.message);
}
},
});


2. 后台返回简单json数据但是不能直接应用:

原因:应用ztree,json数据必须要有id、pId和name字段,参见:view-source:http://www.treejs.cn/v3/demo/cn/core/simpleData.html

不能直接应用数据如下:

{
"message": "接口调用成功!",
"status": 0,
"list": [
{
"ParentId": 0,
"Value": null,
"Isleaf": 1,
"Webid": 5988,
"Intval": null,
"Adduserid": 6414,
"Mode": 0,
"Name": "1",
"Time": "2016-09-02",
"Del": 0,
"Describ": null,
"Id": 82980,
"Orderid": 0
},
{
"ParentId": 0,
"Value": null,
"Isleaf": 1,
"Webid": 5988,
"Intval": null,
"Adduserid": 6414,
"Mode": 0,
"Name": "2",
"Time": "2016-09-13",
"Del": 0,
"Describ": null,
"Id": 84190,
"Orderid": 1
},
{
"ParentId": 0,
"Value": null,
"Isleaf": 1,
"Webid": 5988,
"Intval": null,
"Adduserid": 6414,
"Mode": 0,
"Name": "3",
"Time": "2016-09-13",
"Del": 0,
"Describ": null,
"Id": 84191,
"Orderid": 2
}
]
}


解决方法:

Base.request({
url: '...',
params: {
m: 0,
},
callback: function(data) {
if(data.status) {
Base.gritter(data.message, false);
}else {
var html ='';
if(data.list[0]) {
var formatData = [],
len = data.list.length;

for(var key in data.list) {
formatData[key] = {};
formatData[key]['name'] = data.list[key]['Name'];
formatData[key]['pId'] = data.list[key]['ParentId']+1;
formatData[key]['id'] = data.list[key]['Id']+1;
}

formatData[len] = {};
formatData[len]['name'] = '全部分类';
formatData[len]['pId'] = 0;
formatData[len]['id'] = 1;
formatData[len]['open'] = true;

$.fn.zTree.init($("#ztree"), setting, formatData);
treeObj = $.fn.zTree.getZTreeObj("ztree");

}else {

}

}
},
});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: