1,首先構造tree接受的格式化數據結構MODEL
/// <summary>
/// 定義EasyUI樹的相關數據,方便控制器生成Json數據進行傳遞
/// </summary>
// [DataContract]
[Serializable]
public class EasyTreeData
{
/// <summary>
/// ID
/// </summary>
// [DataMember]
public string id { get; set; }
/// <summary>
/// 節點名稱
/// </summary>
// [DataMember]
public string text { get; set; }
/// <summary>
/// 是否展開
/// </summary>
//[DataMember]
public string state { get; set; }
/// <summary>
/// 圖標樣式
/// </summary>
// [DataMember]
public string iconCls { get; set; }
/// <summary>
/// 子節點集合
/// </summary>
// [DataMember]
public List<EasyTreeData> children { get; set; }
/// <summary>
/// 默認構造函數
/// </summary>
public EasyTreeData()
{
this.children = new List<EasyTreeData>();
this.state = "open";
}
/// <summary>
/// 常用構造函數
/// </summary>
public EasyTreeData(string id, string text, string iconCls = "", string state = "open")
: this()
{
this.id = id;
this.text = text;
this.state = state;
this.iconCls = iconCls;
}
/// <summary>
/// 常用構造函數
/// </summary>
public EasyTreeData(int id, string text, string iconCls = "", string state = "open", List<EasyTreeData> children=null )
: this()
{
this.id = id.ToString();
this.text = text;
this.state = state;
this.iconCls = iconCls;
this.children = children;
}
}
2,前台代碼
2.1,前台代碼html代碼
<ul id="tt"></ul>
2.2,前台代碼腳本
<script type="text/javascript">
$(function () {
$('#tt').tree({
checkbox: false,
url: '/Cultivate/GetUserTreeJson',
onClick: function (node) {
alert(node.id);
}
});
});
</script>
3,控制器(Cultivate)的方法GetUserTreeJson'
3.1,控制器(Cultivate)的方法GetUserTreeJson代碼
[HttpPost]
public ActionResult GetUserTreeJson()
{
int PID = -1;
List<EasyTreeData> treeList = new List<EasyTreeData>();
if (PID == -1)
{
var list = (from p in db.cultivates
where p.NodePID == PID
orderby p.NodeID
select p).ToList();
foreach (cultivate info in list)
{ var child = (from p in db.cultivates
where p.NodePID == info.NodeID
orderby p.NodeID
select p).ToList();
if (child.Count ==0)
{
treeList.Add(new EasyTreeData(info.NodeID, info.NodeName, "icon-user"));
}
else
{
treeList.Add(new EasyTreeData(info.NodeID, info.NodeName, "icon-user","open", GetUserTreeJson2(info.NodeID)));
}
}
}
string json = ToJson(treeList);
return Content(json);
}
3.2,如果有N級菜單循環代碼
private List<EasyTreeData> GetUserTreeJson2( int PID)
{
List<EasyTreeData> treeList = new List<EasyTreeData>();
var list = (from p in db.cultivates
where p.NodePID == PID
orderby p.NodeID
select p).ToList();
foreach (cultivate info in list)
{
var child = (from p in db.cultivates
where p.NodePID == info.NodeID
orderby p.NodeID
select p).ToList(); ;
if (child.Count == 0)
{
treeList.Add(new EasyTreeData(info.NodeID, info.NodeName, "icon-user"));
}
else
{
treeList.Add(new EasyTreeData(info.NodeID, info.NodeName, "icon-user", "closed", GetUserTreeJson2(info.NodeID)));
}
}
return treeList;
}
3.3,Json代碼生成。
protected string ToJson(object obj)
{
string jsonData = (new JavaScriptSerializer()).Serialize(obj);
return jsonData;
}