首页 > 代码库 > 带CheckBox的dojo Tree简单实现,并实现级联选取
带CheckBox的dojo Tree简单实现,并实现级联选取
dojo自带的Tree不能实现CheckBox选取节点功能,第三方cbtree过于复杂,因此自己写了个简单的实现,能够实现子节点级联父节点直到根节点,父节点选取全选子节点的功能,但没有写父节点取消时的子节点取消,代码如下,大家可以自行拷贝修改
function createMenuTree() {
require(["dojo/request",
"dojo/store/Memory",
"dijit/tree/ObjectStoreModel",
"dijit/Tree"], function (request, Memory, ObjectStoreModel, Tree) {
request("/Role/Menus/", { handleAs: "json", preventCache: true }).then(function (data1) {
for (var i = 0; i < data1.length; i++) {
data1[i].checked = false;
}
menuStore = new Memory({
idProperty: "PID",
data: data1,
getChildren: function (object) {
return this.query({ PPARENT: object.PID });
}
});
menuModel = new ObjectStoreModel({
store: menuStore,
labelAttr: "PNAME",
query: { PID: "Menu" },
mayHaveChildren: function (item) {
var subs = menuStore .query({ "PPARENT": item.PID });
return subs.length > 0;
}
});
menuTree = new Tree({
model: menuModel,
autoExpand:true,
onClick: function (item, node, evt) {
console.debug(menuTree.paths);
var selCb = dojo.byId("pjtchk"+item.PID);
if (selCb == null) { return; }
if (!dojo.hasAttr(selCb, "checked")) {
node.labelNode.innerHTML = "<input id=‘pjtchk" + item.PID + "‘ checked type=‘checkbox‘ />" + item.PNAME;
selectUppers(item.PID);
selectSubs(item.PID);
} else { node.labelNode.innerHTML = "<input id=‘pjtchk" + item.PID + "‘ type=‘checkbox‘ />" + item.PNAME; }
},
_createTreeNode: function (/*Object*/args) {
var tnode = new dijit._TreeNode(args);
tnode.labelNode.innerHTML = "<input id=‘pjtchk" + args.item.PID + "‘ type=‘checkbox‘ />" + args.label;
return tnode;
}
});
menuTree.placeAt($("menuTree"));
menuTree.startup();
});
});
}
function selectUppers(id) {
var sMenus = menuStore.query({ PID: id });
if (sMenus != null && sMenus.length > 0) {
var cb = $("pjtchk" + id);
if (cb != null) {
dojo.attr(cb, ‘checked‘, true);
selectUppers(sMenus[0].PPARENT);
}
}
}
function selectSubs(id) {
var sMenus = menuStore.query({ PID: id });
if (sMenus != null && sMenus.length > 0) {
var cb = $("pjtchk" + id);
if (cb != null) {
dojo.attr(cb, ‘checked‘, true);
}
}
var menus = menuStore.query({ PPARENT: id });
if (menus != null && menus.length > 0) {
dojo.forEach(menus, function (menu) {
selectSubs(menu.PID);
});
}
}
带CheckBox的dojo Tree简单实现,并实现级联选取