基于MVC5和Bootstrap的jQuery TreeView树形控件(二)之数据支持json字符串、list集合

2019-11-20 09:15:32

字体：大中小

来源：转载

供稿：网友

在上篇给大家介绍了基于MVC5和Bootstrap的jQuery TreeView树形控件(一)之数据支持json字符串、list集合。

这种方式其实还是利用list集合的方式传给前台，只不过在前台做了一些小小的变化，而控制器代码也进行了部分的优化，值的一提的是：没用的ajax前后台交互舍弃掉了。

控制器代码如下：

//实例化公共静态字典表集合public static List<TC_DictionaryInfo> DInfo = new List<TC_DictionaryInfo>();/// <summary>/// TreeView视图/// </summary>/// <returns></returns>public ActionResult May(string TypeCode){ViewBag.TypeCode = TypeCode;List<TC_DictionaryInfo> DInfo = dbll.GetModelList("TypeCode=" + TypeCode);List<NodeModel> list = GetChildNodes(0, new NodeModel() { }, DInfo).nodes;ViewBag.data = list;}///<summary>/// GetChildNodes方法，此方法使用递归/// </summary>/// <param name="parentId"></param>/// <returns></returns>public NodeModel GetChildNodes(int parentId, NodeModel childnodestr, List<TC_DictionaryInfo> DInfo){List<TC_DictionaryInfo> DictionaryList = DInfo.Where(e => Convert.ToInt32(e.ParentId) == parentId).ToList();for (int i = 0; i < DictionaryList.Count; i++){NodeModel NewNode = new NodeModel();NewNode.DicId = DictionaryList[i].DicId;NewNode.text = DictionaryList[i].DICName;NewNode.ParentId = DictionaryList[i].ParentId;childnodestr.nodes.Add(NewNode);GetChildNodes(NewNode.DicId, NewNode, DInfo);}return childnodestr;}

PS:不再是三个方法而简化为两个方法（几乎没什么变动）。

前台代码如下：

var data='@JsonConvert.SerializeObject( ViewBag.data)'.replace(/"/g,'"');$(function() {$('#treeview4').treeview({color: "#428bca",data: data,onNodeSelected: function(event, data) {alert(data);}});

PS:这里用到了.NET 下开源的json格式序列号和反序列化的类库

https://www.ibm.com/developerworks/cn/web/wa-lo-json/ ，

下面介绍json序列化和反序列化的两个重要方法：

JsonConvert.SerializeObject(object value)序列化，

它有个重载方法JsonConvert.SerializeObject(object value, params JsonConverter[] converters)。

JsonConvert.DeserializeObject(string value, Type type)，反序列化，

它有个重载方法JsonConvert.DeserializeObject(string value, Type type, params JsonConverter[] converters)

这两个方法可以实现基本的序列化和反序列化要求。

js中的replace的作用是将特定的符号替换为自己需要的符号。

而这里replace(///g,'"')的作用是把所有的 / 都替换为“（因为页面需要的是json字符串）。

这样的话我们的页面就可以读取数据进行显示了。BZ还是感觉这种方式更好一点。

以上所述是小编给大家介绍的基于MVC5和Bootstrap的jQuery TreeView树形控件(二)之数据支持json字符串、list集合，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对武林网网站的支持！