使用spearate菜单和jstree-grid时获取jstree的节点ID

发布于 2024-11-18 00:28:48 字数 2142 浏览 7 评论 0原文

我的 jstree 使用 jstree-grid,其中一列包含一个操作菜单(由单独的代码生成,我需要做的就是应用类“actionHandler”在运行时生成菜单)。该操作菜单由一些额外的 div、ul 和 li 组成,它们几乎淹没了 HTML 代码中的点击事件

我想要完成的任务如下:

当单击 admin_new (代表“新节点”)选项时,我希望能够检索单击生成的菜单的节点的 ID,以便将此节点附加为当前节点的子节点。

这是我当前的代码:

jQuery("#structureBuilderTable").jstree({
           json_data: {data: testData},
           themes: {
                theme : "apple",
                dots : false,
                icons : false
           },
           plugins: ["json_data", "crrm", "ui", "themes", "grid"],
           core: {initially_open: [1]},
           grid : {
                 columns: [
                    {width: 200, header: "Title"},
                    {value:"id", width: 50, header: "id"},
                    {value:"logicalTitle", width: 50, header:"logical title"},
                    {width: 100, header:"handlinger", cellClass:'actionHandler'},
                    {value:"resource", width: 200, header:"resource"}
                 ]
           }
        }).bind("loaded_grid.jstree", function()
          {
          generateActionMenu("span.actionHandler",{
            admin_new: function(e){
              var nodeID = $(e.target).parents(/* Need an unique property*/).data('id');
            },
            admin_delete: function(e){
                /* delete node*/
            }, 'admin_open');
            });

这是我的虚拟 JSON:

var testData = [
            {
                data: "Seksjon1",
                attr: {id:"1", logicalTitle:"r2d2", resource:"videofile"},
                children: [
                    {
                        data: "Flersvar",
                        attr: {id:"2", logicalTitle:"c3p0", resource:"checkbox"}
                    },
                    {
                        data: "Flashtest",
                        attr: {id:"3", logicalTitle:"d2r2", resource:"flash"}
                    }
                ]
            }];

主要问题是,由于没有选择节点,所以我无权访问任何 jstree 特定事件(提供对数据对象的访问权限,这可能会解决问题)。

所以,问题基本上是:如何在不直接操作树的情况下检索相关节点信息?

任何帮助将非常感激! (抱歉文字墙:p)

My jstree uses jstree-grid, and one of the columns includes an action menu (which is generated by separate code, and all I need to do is apply the class "actionHandler" to generate the menu at runtime). This action menu consists of some extra div's, ul's and li's, which pretty much drowns the click event in HTML code.

What I want to accomplish is the following:

When the admin_new (representing 'new node') choice is clicked, I want to be able to retrieve the ID of the node for which the generated menu was clicked, in order to append this node as a child for the current node.

This is my current code:

jQuery("#structureBuilderTable").jstree({
           json_data: {data: testData},
           themes: {
                theme : "apple",
                dots : false,
                icons : false
           },
           plugins: ["json_data", "crrm", "ui", "themes", "grid"],
           core: {initially_open: [1]},
           grid : {
                 columns: [
                    {width: 200, header: "Title"},
                    {value:"id", width: 50, header: "id"},
                    {value:"logicalTitle", width: 50, header:"logical title"},
                    {width: 100, header:"handlinger", cellClass:'actionHandler'},
                    {value:"resource", width: 200, header:"resource"}
                 ]
           }
        }).bind("loaded_grid.jstree", function()
          {
          generateActionMenu("span.actionHandler",{
            admin_new: function(e){
              var nodeID = $(e.target).parents(/* Need an unique property*/).data('id');
            },
            admin_delete: function(e){
                /* delete node*/
            }, 'admin_open');
            });

And this is my dummy JSON:

var testData = [
            {
                data: "Seksjon1",
                attr: {id:"1", logicalTitle:"r2d2", resource:"videofile"},
                children: [
                    {
                        data: "Flersvar",
                        attr: {id:"2", logicalTitle:"c3p0", resource:"checkbox"}
                    },
                    {
                        data: "Flashtest",
                        attr: {id:"3", logicalTitle:"d2r2", resource:"flash"}
                    }
                ]
            }];

The main problem is that since no node is selected, I don't have access to any jstree specific events (giving access to the data object, which could've potentially solved the problem).

So, the question is basically: How can I retrieve relevant node information without directly manipulating the tree?

Any help would be greatly appreciated! (Sorry for the wall of text :p)

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

む无字情书 2024-11-25 00:28:48

解决方案已发布:请参阅我的评论。

The solution has been posted: see my comment.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文