jstree中如何回滚无法移动的节点

2024-02-18

我试图弄清楚如何仅回滚未成功移动的文件夹节点。下面的代码是我正在尝试做的事情的示例。当您选择了几个文件夹并将它们移动到另一个文件夹中时,就会出现问题。如果其中一个目录无法移动,我希望能够将其回滚到其原始父目录。 很遗憾$.jstree.rollback(data.rlbk);将所有选择的文件夹回滚到之前的位置。

$("#tree").jstree({...}).bind("move_node.jstree", function (e, data) {
    // process all selected nodes directory
    data.rslt.o.each(function (i) {
         // Send request.
         var move = $.parseJSON($.ajax({
             url: "./jstree.php",
             type: 'post',
             async: false,
             data: {
                 operation:  "move_dir",
                 ....
             }
         }).responseText);
         // When everything's ok, the reponseText will be {success: true}
         // In all other cases it won't exist at all.
         if(move.success == undefined){
             // Here I want to rollback the CURRENT failed node.
             // $.jstree.rollback(data.rlbk); will rollback all 
             // of the directories that have been moved.
         }
    }
});

有办法做到这一点吗?


我以前看过使用 jstree,但没有在我的代码中使用它。因此,代码可能不正确,但概念应该正确。

根据您的代码,您似乎正在服务器端执行移动操作,并且希望更新树以反映结果。

根据 jsTree 文档,您似乎无法提交节点更新并回滚到上次提交。

您可以回滚树(所有更改)并随后执行移动,而不是仅回滚您不需要的更改。

为了更好地理解下面的代码,您可能需要阅读它(或创建副本),而不需要在“if”语句的条件中设置或引用“wasTriggeredByCode”的行。

$("#tree").jstree({...}).bind("move_node.jstree", function (e, data) {

    var jsTree = $(this);
    var successes = [];

    // Becomes true when function was triggered by code that updates jsTree to
    //  reflect nodes that were successfully moved on the server
    var wasTriggeredByCode = false;

    // process all selected nodes directory
    data.rslt.o.each(function (i) {

         // I'm not certain that this is how the node is referenced
         var node = $(this);

         wasTriggeredByCode = (wasTriggeredByCode || node.data('redoing'));

         // Don't perform server changes when event was triggered from code
         if (wasTriggeredByCode) {
             return;
         }

         // Send request.
         var move = $.parseJSON($.ajax({
             url: "./jstree.php",
             type: 'post',
             async: false,
             data: {
                 operation:  "move_dir",
                 ....
             }
         }).responseText);

         if(move.success){
             successes.push(node);
         }
    });

    // Don't continue when event was triggered from code
    if (wasTriggeredByCode) {
         return;
    }

    // Roll back the tree here
    jsTree.rollback(data.rlbk);

    // Move the nodes
    for (var i=0; i < successes.length; i++) {
        var node = successes[i];

        // According to the documentation this will trigger the move event,
        //  which will result in infinite recursion. To avoid this you'll need
        //  to set a flag or indicate that you're redoing the move.
        node.data('redoing', true);

        jsTree.move_node(node, ...);

        // Remove the flag so that additional moves aren't ignored
        node.removeData('redoing');
    }
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

jstree中如何回滚无法移动的节点 的相关文章

  • HTML5 游戏到本机应用程序 [关闭]

    Closed 这个问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我正在用 HTML5 制作游戏 我最熟悉 HTML5 并且比 C 等更高级的语言更喜欢它 HTML5
  • 正则表达式没有按预期工作?

    我有这个正则表达式 new RegExp a z 0 9 ig 我正在测试一个不应该工作的字符串 vc 但它确实通过了测试 而且它不应该 new RegExp a z 0 9 ig test vc true 但如果我删除其中一个 or or
  • 在模态上自动滚动引导模态('show')

    我有一个用于评论的引导模式 评论表格附加在评论列表的底部 我希望此模式在打开时滚动到列表底部 如果有超过 2 或 3 条评论 我已经安装了这个幻灯片插件 http jesseprice com jquery slide to plugin
  • 如何在 Angular 模板中嵌入 GitHub gist?

    角度忽略script其模板中包含标签 但加载 GitHub gist 需要它们 执行此操作的最佳做 法是什么 使用iframe 创造script动态标记 或者是其他东西 一种方法是创建一个iframe with script里面并在你希望你
  • ES6 生成器——它们真的是 async/await 的替代品吗?

    评论区的帖子之一this http blogs msdn com b typescript archive 2014 10 22 typescript and the road to 2 0 aspx打字稿博客文章说 如果我必须等到 2 0
  • 如何处理 React JSX 中的长类名?

    假设我在 React JSX 中渲染这个组件 render return h1 Some text h1 这些类触发我的 JS linter 的行太长 而且很难阅读 怎样才能分开长className将 React 组件中的属性分成多行而不破
  • JavaScript 中的凯撒密码

    我正在尝试编写一个程序来解决javascript中的以下问题 写在本段下面 我不知道为什么我的代码不起作用 有人可以帮助我吗 我是 JavaScript 新手 这是一个免费的代码训练营问题 现代常见的用法是 ROT13 密码 其中字母的值移
  • Javascript 3d 绘图实用程序? [关闭]

    Closed 这个问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 有谁知道有什么好的 javascript 3d 绘图实用程序吗 我知道每个网站都推荐过画布 3d 图
  • 单击 div 中的图像时如何翻转该 Div?

    好吧 我对编写 Javascript 知之甚少 我可以对其进行一些编辑 并且涉足了 CSS3 动画 我将向您展示我正在努力实现的目标 然后在下面进行解释 网站布局将是这样的 https i stack imgur com RMb4R jpg
  • Firestore——仅获取大型同步集合中已更改的文档

    我已阅读下面的所有问题 但在文档中找不到任何内容来描述如何同步集合和接收only更改集合中的文档 我的同步集合中有超过 500 个文档 使用redux saga firebase 同步集合 https redux saga firebase
  • jquery 在元素之间包裹内容

    我有一些内容由 hr 标记 我需要做的是将开始标记和结束标记之间的所有内容包装起来 鉴于此标记 hr class begin some content
  • 使用XMLHttpRequest自动网页刷新内存泄漏

    问候 我一直在为一些使用 8 位微控制器的硬件开发网络界面 该网页使用 HTML javascript JSON 和 XHR XMLHttpRequest 进行通信 我想做的是创建一个页面 使用 setInterval 使用控制器中的新值每
  • Javascript 警报/消息框中的欧元符号或其他实体

    有谁知道我如何在 javascript 警报窗口中显示欧元或其他 html 实体 alert u20AC HTML 实体字符查找 http leftlogic com lounge articles entity lookup
  • jquery 中 DOM 元素的手动垃圾回收是否可以提高浏览器性能?

    在性能范围内 删除不再需要的元素是否有意义 或者浏览器是否对代码中未进一步引用的 dom 元素执行自动垃圾收集 some element fadeOut 1000 function el el remove lt does this mak
  • Kotlin JavaScript 到 TypeScript 定义文件

    我已经找到了ts2kt 库 https github com Kotlin ts2kt这将从任意位置创建 Kotlin 头文件 d ts文件 但是 我想朝相反的方向走 我想构建一个可以编译为 JavaScript 的 Kotlin 库 但我
  • 图像未显示在从 HTML 创建的 PDF 上

    我想动态创建 PDF 这意味着我将从 Google Drive 获取文件 然后将它们放入 HTML 代码中 并尝试从中创建 PDF 一切工作正常 除了图像没有显示 我现在正在做的是 从 HTML 字符串创建 HtmlOutput 获取该 H
  • 如何使用 Typescript 设置 Material-UI for React?

    我在将 Material UI 添加到我的 React 项目中时遇到了一些问题 该项目是用 Typescript 编程的 根据教程 我首先添加react tab event plugin import injectTapEventPlugi
  • Nodejs 解码 base64 并使用流将它们保存到文件中

    在我的node js应用程序中 我使用以下代码行解码base64编码的图像 const fileDataDecoded Buffer from base64EncodedfileData base64 到目前为止 我可以使用以下代码编写一个
  • 如何在画布中旋转图表同时保持数字垂直?

    我正在尝试围绕其中心旋转画布中的图表 同时保持字母直立 我正在尝试使用 ctx rotate 但它使用画布的左侧作为中心来旋转整个图表 以下链接提供了视觉效果 我希望它看起来像绿色 而不是红色 就像我的代码当前所做的那样 视觉解释 http
  • Javascript 最佳实践,为什么使用逗号来链接函数/变量声明?

    我一直在为 jQuery jQueryLog 开发一个插件 以允许调试链选择器和返回值 如果你想检查一下 你可以这样做here http www jquerylog com 这已经是第二个版本了 第一个版本实际上是经过编辑的 jQuery

随机推荐