zoukankan      html  css  js  c++  java
  • 基于Bootstrap的JQuery TreeView树形控件,数据支持json字符串、list集合(MVC5)<二>

    上篇博客给大家介绍了基于Bootstrap的JQuery TreeView树形控件,数据支持json字符串、list集合(MVC5)<一>,

    其中的两种方式都显得有些冗余。接着上篇博客继续说:

    这种方式其实还是利用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;
            }
    View Code

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

    前台代码如下:

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

    PS:这里用到了.NET 下开源的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还是感觉这种方式更好一点。
    感谢张老师、方总的指点!
    欢迎各位小菜和我一起成长,也欢迎各位大神对本文不足之处提出建议。
  • 相关阅读:
    邁向IT專家成功之路的三十則鐵律 鐵律八:IT人學習之道-基礎功
    邁向IT專家成功之路的三十則鐵律 鐵律七:IT人效率之道-時間管理
    邁向IT專家成功之路的三十則鐵律 鐵律六:求全求盈之道-佈施
    邁向IT專家成功之路的三十則鐵律 鐵律五:IT人穩定發展之道-去除惡習
    邁向IT專家成功之路的三十則鐵律 鐵律四:IT人快速成長之道-複製
    邁向IT專家成功之路的三十則鐵律 鐵律三:IT人長久之道–站對邊
    巧架个人BT服务器
    定制属于自己的自动化安装的linux系统镜像
    如何从Win7中提取制作Windows PE3.0
    将现有Ubuntu系统做成LiveCD
  • 原文地址:https://www.cnblogs.com/A-aron/p/5760730.html
Copyright © 2011-2022 走看看