Views代码

@{

    Layout = null;

}

<!DOCTYPE html>

<html>

<head>

    <meta name="viewport" content="width=device-width" />

    <title>Index</title>

    <script src="~/content/js/plugins/jsTree/jstree.min.js"></script>

</head>

<body>

    <div id="using_json"></div>

    <script>

        $(document).ready(function () {

            @{

                var a = new HtmlString(ViewBag.Region);//将动态数据转换成HTMLstring格式

            }

            $("#using_json").jstree(@a);//jsTree绑定数据

        });

    </script>

</body>

</html>

Controller代码

        public ActionResult Index()

        {

            RegionModels list = new RegionModels();

            list.region = service.GetRegion();//查询区域数据

            list.dormcategory = service.GetDormCategory();//获取宿舍类型

            RegionModel region = service.GetSingleRegion("");

            ViewBag.Region = GetRegionJson(region.Cid, list.region);

            return View(list);

        }

        /// <summary>

        /// 返回jsTree的最外层值

        /// </summary>

        /// <param name="parentid">父级Cid</param>

        /// <param name="data">数据</param>

        /// <returns></returns>

        public string GetRegionJson(string parentid, List<RegionModel> data)

        {

            string icon = GetIcon();

            string a = "{\"core\": {\"themes\": {\"theme\": \"classic\",\"dots\": true},\"data\":[{\"text\":\"区域\",\"icon\": \""+icon+"\",\"id\":\"" + parentid + ",0\",\"state\": {\"opened\": true },\"children\":[";

            StringBuilder sb = new StringBuilder(a);

            RegionList(parentid, data, sb);//添加子集数据

            sb.Append("]}]}}");

            return sb.ToString();

        }

        /// <summary>

        /// 添加jsTree子集数据

        /// </summary>

        /// <param name="parentid"></param>

        /// <param name="list"></param>

        /// <param name="sb"></param>

        public void RegionList(string parentid, List<RegionModel> list, StringBuilder sb)

        {

            IEnumerable<RegionModel> temp = list.Where(n => n.ParentCid.Trim() == parentid).OrderBy(r => r.Name);

            foreach (var item in temp)

            {

                string open = item.Level ==  ? "true" : "false";

                string icon = GetIcon(item.Level);

                string lastComma = "";

                if (item != temp.Last())

                    lastComma = ",";

                List<RegionModel> children = list.Where(n => n.ParentCid.Trim() == item.Cid).ToList();

                if (children.Count == )

                {

                    sb.Append($" {{ \"text\": \"{item.Name}\",\"icon\": \"{icon}\",\"id\":\"{ item.Cid.ToString() + "," + item.Level.ToString()}\",\"state\": {{\"opened\": {open} }},}}{lastComma}");

                }

                else

                {

                    sb.Append($" {{\"text\": \"{item.Name}\",\"icon\": \"{icon}\",\"id\":\"{ item.Cid.ToString() + "," + item.Level.ToString()}\",\"state\": {{\"opened\":  {open} }},");

                    sb.Append("\"children\": [");

                    RegionList(item.Cid, list, sb);

                    sb.Append($"]}}{lastComma}");

                }

            }

        }

结果

jsTree动态加载数据的更多相关文章

  1. AppCan学习笔记----关闭页面listview动态加载数据

    AppCan页面关闭 AppCan 的页面是由两个HTML组成,如果要完全关闭的话需要在主HTML eg.index.html中关闭,关闭方法:appcan.window.close(-1); 管道 ...

  2. [JS前端开发] js/jquery控制页面动态加载数据 滑动滚动条自动加载事件

    页面滚动动态加载数据,页面下拉自动加载内容 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样的效果:进入qq空间,向下拉动空 ...

  3. 微信小程序（五） 利用模板动态加载数据

    利用模板动态加载数据,其实是对上一节静态数据替换成动态数据:

  4. mui 动态加载数据出现的问题处理 (silder轮播组件 indexedList索引列表 下拉刷新不能继续加载数据)

    mui-slider 问题:动态给mui的图片轮播添加图片,轮播不滚动. 解决:最后把滚动轮播图片的mui(".mui-slider").slider({interval: 300 ...

  5. ASP.NET MVC动态加载数据

    ASP.NET MVC动态加载数据,一般的做法是使用$.each方法来循环产生tabel: 你可以在html时先写下非动态的部分:  Source Code 上图中,有一行代码: <tbody ...

  6. js实现滚动条来动态加载数据

    主要angular2+es6 data:Array<any> //展示的数据 allData:Array<any> //全部的数据 size:number = 10 //每次动 ...

  7. js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的

    js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样 ...

  8. js动态加载数据并合并单元格

    js动态加载数据合并单元格, 代码如下所示,可复制直接运行: <!DOCTYPE HTML> <html lang="en-US"> <head> ...

  9. 爬虫--selenuim和phantonJs处理网页动态加载数据的爬取

    1.谷歌浏览器的使用 下载谷歌浏览器 安装谷歌访问助手 终于用上谷歌浏览器了.....激动 问题:处理页面动态加载数据的爬取 -1.selenium -2.phantomJs 1.selenium 二 ...

随机推荐

  1. HDU - 4901 The Romantic Hero（dp）

    https://vjudge.net/problem/HDU-4901 题意 给n个数,构造两个集合,使第一个集合的异或和等于第二个集合的相与和,且要求第一个集合的元素下标都小于第二个集合的元素下标. ...

  2. Java编程思想 学习笔记2

    二.一切都是对象 1.用引用操纵对象 在Java中,一切都被视为对象,但操纵的标识符实际上是对象的一个“引用”.可以将这想象成遥控器(引用)来操纵电视机(对象).另外,没有电视机,遥控器也可以单独存在 ...

  3. 流媒体技术学习笔记之（十七）FFmpeg 3.3《希尔伯特》-新版本的亮点

    FFmpeg 3.3“Hilbert”,一个新的主要版本的一些亮点: 苹果Pixlet解码器 NewTek SpeedHQ解码器 QDMC音频解码器 PSD(Photoshop Document)解码 ...

  4. HTML5 元素拖拽实现 及 jquery.event.drag插件

    如上图片: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" c ...

  5. 17. Spring Boot 配置嵌入式Servlet容器

    一.如何定制和修改Servlet容器的相关配置 1.配置文件(ServerProperties): 优先级最高 server.port=8081 server.context‐path=/crud s ...

  6. C语言入门教程-(6)运算符

    1.运算符概述 运算符是一种编译器执行特定的数学或逻辑操作的符号.C语言提供了以下类型的运算符: 算术运算符 关系运算符 逻辑运算符 位运算符 赋值运算符 条件运算符 其他运算符 2.算术运算符 算术 ...

  7. mysql 案例 ~查询导致的tmp临时文件问题

    一 简介:之前遇到一个tmp分区暴涨的问题,后来经过大神的指点,遂分析写下 二 分类: 1  select语句出现 using temporay tmp 下出现 #sql_631a_1.MYD #sq ...

  8. jquery 学习(四) - 标签 添加/删除/修改

    HTML代码 <div class="a1"> <div> <span id="a2">aaa</span> & ...

  9. JavaScript学习 - 基础(四) - 控制语句/异常处理

    控制语句 if-else 语句 <script> //控制语句 //if-else格式: var x = 1 if(x==1){ console.log("this is if& ...

  10. 实用技能之Python打包制作成EXE可执行程序

    制作环境:Andconda3,python3.6 一.安装pyInstaller 方式一): 在命令行输入:pip install pyinstaller 方式二): ①   下载pyInstalle ...