jquery zTree树开发实例之点击树节点获取节点信息显示到表格中

效果图:

jquery zTree树开发实例之点击树节点获取节点信息显示到表格中_第1张图片

数据库表结构:

代码:

jsp代码:

style="width:80%;height:80%">

js代码:

var selectedNode=false;

var setting = {

data : {

simpleData : {

enable : true

}

},

callback : {

onClick : zTreeOnClick,

beforeClick : zTreeBeforeClick

}

};

function zTreeOnClick(event, treeId, treeNode) {

selectedNode = treeNode;

var vipName = treeNode.name;

var vipWxid = treeNode.id;

var vipMobile = treeNode.mobile;

var vipType = treeNode.type;

var vipBirthday = treeNode.birthday;

var vipImage = treeNode.mage;

var vipCash = treeNode.cash;

var vipUpdatetime= treeNode.updatetime;

$('#vipTable').datagrid({

rownumbers : true,

idField : 'id',

fitColumns : true,

singleSelect : true,

fit : true,

pagination : true,

border : false,

columns : [ [

{title : '会员姓名',field : 'Name',align : 'center'},

{title : '微信id',field : 'Wxid',align : 'center'},

{title : '生日',field : 'birthday',align : 'center'},

{title : '手机号',field : 'phone',align : 'center'},

{title : '图片',field : 'image',align : 'center'},

{title : '金额',field : 'cash',align : 'center'},

{title : '更新日期',field : 'updatetime',align : 'center'}

] ],

data : [ {

Name : vipName,

Wxid : vipWxid,

birthday:vipBirthday,

phone:vipMobile,

image:vipImage,

cash:vipCash,

updatetime:vipUpdatetime

} ]

});

$('#vipTable').datagrid('reload', data);

}

java后台实现类代码:

public void deal(JWRequest request, JWResponse response)

throws ErrorCodeException {

// TODO Auto-generated method stub

String action = request.getAction();

if ("getVipByStatus".equalsIgnoreCase(action)) {

getVipLists(request, response);

}

}

    private void getVipLists(JWRequest request, JWResponse response) {

    VipExample example = new VipExample();

List vipList = this.vipDao.selectByExample(example);

// String s=vipList.toString();

// System.out.println(s);

// 转换成ztree格式

JSONArray ztreeNodes = new JSONArray();

JSONObject json = new JSONObject();

json.put("id", 0);

json.put("pId", -1);

json.put("name", "所有会员");

json.put("open", true);

json.put("icon", "web/images/sm_role.png");

ztreeNodes.add(json);

for (Vip user: vipList) {

json = new JSONObject();

json.put("id", user.getWxid());

json.put("pId", "0");

json.put("name", user.getName());

json.put("icon", "web/images/sm_user.png");

json.put("mobile", user.getMobile());

json.put("birthday", user.getBirthday());

json.put("image", user.getImage());

json.put("cash", user.getCash());

json.put("updatetime", user.getUpdatetime());

ztreeNodes.add(json);

}

JSONObject resData = new JSONObject();

resData.put("ztreeNodes", ztreeNodes);

response.setData(resData);

}

————————————————

原文链接:https://blog.csdn.net/qinyf2015/article/details/78133184

https://blog.csdn.net/qq_36639124/article/details/81220665

你可能感兴趣的:(jquery zTree树开发实例之点击树节点获取节点信息显示到表格中)