【问题标题】:jsTree not getting data from serverjsTree没有从服务器获取数据
【发布时间】:2015-11-10 15:04:38
【问题描述】:

在我的 mvc 应用程序中,我使用了 jsTree,

我的看法

                @{
                ViewBag.Title = "OnDemand";
            }

            <script src="~/Scripts/jquery-1.9.1.min.js"></script>
            <script src="~/Scripts/jstree.min.js"></script>

            <h2>OnDemand - Treeview</h2>
            <div id="demo1">

            </div>
            <script type="text/javascript">
                jQuery(function($) { 


                    $("#demo1").jstree({
                        "json_data": {
                            "ajax": {
                                "type": "POST",
                                "dataType": "json",
                                "async": true,
                                "contentType": "application/json;",
                                "opts": {
                                    "method": "POST",
                                    "url": "/Treeview/GetAllNodes11"
                                },
                                "url": "/Treeview/GetAllNodes11",
                                "data": function (node) {
                                    if (node == -1) {
                                        return '{ "operation" : "get_children", "id" : -1 }';
                                    }
                                    else {
                                        //get the children for this node
                                        return '{ "operation" : "get_children", "id" : ' + $(node).attr("id") + ' }';
                                    }
                                },
                                "success": function (retval) {
                                    return retval.d;
                                },
                            }
                        },
                        "plugins": ["themes", "json_data"]
                    });
                });
            </script>

我的控制器

[HttpPost] 公共 JsonResult GetAllNodes11(字符串 id) { 列表 G_JSTreeArray = new List();

        G_JSTree _G_JSTree = new G_JSTree();
        _G_JSTree.data = "x1";
        _G_JSTree.state = "closed";
        _G_JSTree.IdServerUse = 10;
        _G_JSTree.children = null;
        _G_JSTree.attr = new G_JsTreeAttribute { id = "10", selected = false };
        G_JSTreeArray.Add(_G_JSTree);

        G_JSTree _G_JSTree2 = new G_JSTree();
        var children =
            new G_JSTree[]
        {
            new G_JSTree { data = "x1-11", attr = new G_JsTreeAttribute { id = "201" } },
            new G_JSTree { data = "x1-12", attr = new G_JsTreeAttribute { id = "202" } },
            new G_JSTree { data = "x1-13", attr = new G_JsTreeAttribute { id = "203" } },
            new G_JSTree { data = "x1-14", attr = new G_JsTreeAttribute { id = "204" } },
        };
        _G_JSTree2.data = "x2";
        _G_JSTree2.IdServerUse = 20;
        _G_JSTree2.state = "closed";
        _G_JSTree2.children = children;
        _G_JSTree2.attr = new G_JsTreeAttribute { id = "20", selected = true };
        G_JSTreeArray.Add(_G_JSTree2);

        G_JSTree _G_JSTree3 = new G_JSTree();
        var children2 =
            new G_JSTree[]
        {
            new G_JSTree { data = "x2-11", attr = new G_JsTreeAttribute { id = "301" } },
            new G_JSTree { data = "x2-12", attr = new G_JsTreeAttribute { id = "302" }, children= new G_JSTree[]{new G_JSTree{data = "x2-21", attr = new G_JsTreeAttribute { id = "3011" }}} },
            new G_JSTree { data = "x2-13", attr = new G_JsTreeAttribute { id = "303" } },
            new G_JSTree { data = "x2-14", attr = new G_JsTreeAttribute { id = "304" } },
        };
        _G_JSTree3.data = "x3";
        _G_JSTree3.state = "closed";
        _G_JSTree3.IdServerUse = 30;
        _G_JSTree3.children = children2;
        _G_JSTree3.attr = new G_JsTreeAttribute { id = "30", selected = true };
        G_JSTreeArray.Add(_G_JSTree3);

        return new JsonResult { Data = G_JSTreeArray, JsonRequestBehavior = JsonRequestBehavior.AllowGet };
    }

但它没有击中控制器

这段代码有什么问题?

【问题讨论】:

  • 有点离题,但考虑升级到 jstree v.3,它更快更健壮。此外,多年来一直不支持 v.1。
  • @vakata 使用 jquery.jstree.js 时,它可以工作,而使用 jstree.js 时,它不工作
  • 将 v.3 视为不同的产品 - 它有不同的选项等 - 这是主要版本更改背后的原因(并完全跳过 2)。如果您决定升级 - 只需阅读 repo 自述文件或 jstree.com。

标签: asp.net-mvc asp.net-mvc-5 jstree


【解决方案1】:

数据不能是函数,因此不会评估基于所选节点的动态数据分配,但您可以使用带有函数的分配 url 来更改要传递给控制器​​的参数。您必须使用 GET 方法从控制器中检索数据 -

试试这个

"json_data": {
                    ajax: {

                        "url": function (node) {
                            var url;
                            if (node == -1) {
                                url = "/Treeview/GetAllNodes11/?operation=get_children";
                            } else {
                                var id = $(node).attr("id");
                                url = "/Treeview/GetAllNodes11/?operation=get_children&id=" + id;
                            }
                            return url;
                        },
                        "type": "GET",
                        "dataType": "json",
                        "contentType": "application/json charset=utf-8",
                    },
                },

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2019-10-15
    • 1970-01-01
    • 1970-01-01
    • 2021-04-16
    • 1970-01-01
    • 1970-01-01
    • 2021-09-28
    • 2021-10-21
    相关资源
    最近更新 更多