bootstrap-treeview 树列表 总结整理
程序员文章站
2022-06-08 10:40:50
...
<link href="~/Content/bootstrap.css" rel="stylesheet" />
<link href="~/Scripts/bootstrap-treeview/css/bootstrap-treeview.css" rel="stylesheet" />
<!-- JS文件 -->
<script src="~/Scripts/jquery-2.1.3.min.js"></script>
<script src="~/Scripts/bootstrap-treeview/js/bootstrap-treeview.js"></script>
<script src="~/Scripts/artDialog/artDialog.js?skin=simple" type="text/javascript"></script>
<script src="~/Scripts/artDialog/plugins/iframeTools.source.js"></script>
获取后台数据
function load_tree(Txt) {
$.ajax({
type: "Post",
url: "/SMS/GetTreeJson",data: { "searchText": Txt },
dataType: "json",
success: function (result) {
$('#tree').treeview({
data: result, // 数据源
showCheckbox: true, //是否显示复选框
highlightSelected: true, //是否高亮选中
//nodeIcon: 'glyphicon glyphicon-user', //节点上的图标
// nodeIcon: 'glyphicon glyphicon-globe',
emptyIcon: '', //没有子节点的节点图标
multiSelect: true, //多选
onNodeChecked: nodeChecked, //级联选择
onNodeUnchecked: nodeUnchecked //级联选择
});
$('#tree').treeview('collapseAll', { silent: true });
},
error: function () {
alert("树形结构加载失败!")
}
});
}
//级联选择
var nodeCheckedSilent = false;
function nodeChecked(event, node) {
if (nodeCheckedSilent) {
return;
}
nodeCheckedSilent = true;
checkAllParent(node);
checkAllSon(node);
nodeCheckedSilent = false;
}
var nodeUncheckedSilent = false;
function nodeUnchecked(event, node) {
if (nodeUncheckedSilent)
return;
nodeUncheckedSilent = true;
uncheckAllParent(node);
uncheckAllSon(node);
nodeUncheckedSilent = false;
}
//选中全部父节点
function checkAllParent(node) {
// $('#tree').treeview('checkNode', node.nodeId, { silent: true });
var parentNode = $('#tree').treeview('getParent', node.nodeId);
var siblings = $('#tree').treeview('getSiblings', node.nodeId);
if (!("nodeId" in parentNode)) {
return;
}
var isAllChecked = true; //是否全部没选中
if (node.nodes != null && node.nodes.length > 0) {
for (var i in node.nodes) {
if (!node.nodes[i].state.checked) {
isAllChecked = false;
break;
}
}
}
for (var j in siblings) {
if (!siblings[j].state.checked) {
isAllChecked = false;
break;
}
}
if (isAllChecked) {
// checkAllParent(parentNode);
$('#tree').treeview('checkNode', parentNode, { silent: true });
}
//else {
// checkAllParent(parentNode);
//}
}
//取消全部父节点
function uncheckAllParent(node) {
$('#tree').treeview('uncheckNode', node.nodeId, { silent: true });
var siblings = $('#tree').treeview('getSiblings', node.nodeId);
var parentNode = $('#tree').treeview('getParent', node.nodeId);
if (!("nodeId" in parentNode)) {
return;
}
var isAllUnchecked = true; //是否全部没选中
//for (var i in siblings) {
// if (siblings[i].state.checked) {
// isAllUnchecked = false;
// break;
// }
//}
if (isAllUnchecked) {
uncheckAllParent(parentNode);
}
}
//级联选中所有子节点
function checkAllSon(node) {
$('#tree').treeview('checkNode', node.nodeId, { silent: true });
if (node.nodes != null && node.nodes.length > 0) {
for (var i in node.nodes) {
checkAllSon(node.nodes[i]);
}
}
}
//级联取消所有子节点
function uncheckAllSon(node) {
$('#tree').treeview('uncheckNode', node.nodeId, { silent: true });
if (node.nodes != null && node.nodes.length > 0) {
for (var i in node.nodes) {
uncheckAllSon(node.nodes[i]);
}
}
}
//获取选中的子节点数据
function getChildChecked(node) {
for (var i in node) {
idList += node[i].Id + ",";
//var _index=node[i].text.indexOf("(");
//var text = node[i].text.substring(0,_index+1)
//areaList += text + ",";
var r = /\((\d+)\)/;
var n = r.exec(node[i].text);
num += parseInt(n[1]);
if (node[i].nodes != null && node[i].nodes.length > 0) {
//有子节点,移除父节点
var nodeid = node[i].Id;
idList = idList.toString().replace(nodeid, '-1');
num -= parseInt(n[1]);
}
}
}
//var nodeA = new List<Node>();
//nodeA.Add(new Node(4, "A01", null));
//nodeA.Add(new Node(5, "A02", null));
//nodeA.Add(new Node(6, "A03", null));
//var nodeB = new List<Node>();
//nodeB.Add(new Node(7, "B07", null));
//nodeB.Add(new Node(8, "B08", null));
//nodeB.Add(new Node(9, "B09", null));
//var nodes = new List<Node>();
//nodes.Add(new Node(1, "A01", nodeA));
//nodes.Add(new Node(2, "B02", nodeB));
//nodes.Add(new Node(3, "A03", null));
参考地址:
http://www.cnblogs.com/mfc-itblog/p/5233453.html
http://blog.csdn.net/jiang_2992/article/details/62042028