JQuery zTree v3.5.14动态绑定心得
///webservice里面的一个方法，在jquery用ajax方法调用；
[WebMethod]
public List<Model.County> FindAll()
{
DAL.County county = new DAL.County();//DAL层代码我就不贴了，相信大家都懂
DataTable dt = county.FindAll();//查询数据库中的一张表有id,name,pId,open字段
List<Model.County> list = new List<Model.County>();
for (int i = 0; i < dt.Rows.Count; i++)
{
Model.County model = new Model.County()
{
id = Convert.ToInt32(dt.Rows[i]["id"]),
name = dt.Rows[i]["name"].ToString(),
pId = Convert.ToInt32(dt.Rows[i]["pid"]),
remark = dt.Rows[i]["remark"].ToString(),
open = "true"
};
list.Add(model);
}
return list;
}
function showIconForTree(treeId, treeNode) {
return !treeNode.isParent;
};
$(document).ready(function () {
var setting = {
view: {
showIcon: showIconForTree
},
data: {
simpleData: {
enable: true
}
}
};
$.ajax({
type: "post",
contentType: "application/json",
url: "../WebService/TreeWebService.asmx/FindAll",
data: "{}",
dataType: "json",
success: function (result) {
var zNodes = result.d;//接受webservice里面传过来的list
$.fn.zTree.init($("#treeDemo"), setting, zNodes);
}
});
});
<head runat="server">
<title></title>
<link href="../Styles/zTreeStyle.css" rel="stylesheet" type="text/css" />
<script src="../Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="../Scripts/jquery.ztree.core-3.5.js" type="text/javascript"></script>
<script src="../Scripts/TreeJScript.js" type="text/javascript"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div>
<ul id="treeDemo" class="ztree"></ul>
</div>
</div>
</form>
</body>
</html>
