解决dtree树形图重置清空操作失效问题

万物可爱_85

已于 2022-11-07 13:47:40 修改

阅读量486

点赞数

CC 4.0 BY-SA版权

文章标签： html 前端

于 2022-11-04 14:18:06 首次发布

本文链接：https://blog.csdn.net/hnn567/article/details/127687996

本文介绍了解决dtree树形图重置清空操作失效的问题，通过使用DemoTree.cancelCheckedNode()方法实现了树形图节点状态的重置，并提供了具体的实现代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

解决dtree树形图重置清空操作失效问题

官方文档：https://www.wisdomelon.com/DTreeHelper/
在这里插入图片描述
重置：主要用这种方法: DemoTree.cancelCheckedNode()

<div class="main-container">
	<ul id="role-power" class="dtree" data-id="0"></ul>
</div>

<div class="bottom">
 <div class="button-container">
     <button type="submit" class="layui-btn layui-btn-normal layui-btn-sm" lay-submit="" lay-filter="power-save">
         <i class="layui-icon layui-icon-ok"></i>
         提交
     </button>
     <button type="button" class="layui-btn layui-btn-primary layui-btn-sm" id="resetBtn">
         <i class="layui-icon layui-icon-refresh"></i>
         重置
     </button>
 </div>
</div>

    layui.use(['dtree', 'form', 'jquery'], function () {
        let dtree = layui.dtree;
        let form = layui.form;
        let $ = layui.jquery;
        let layer = layui.layer;
        var DemoTree=dtree.render({
            elem: "#role-power",
            method: "get",
            url: "/xxxx?roleId=" + [[${Id}]],
            dataFormat: "list",
            checkbar: true,
            skin: "layui",
            initLevel: "1",
            checkbarType: "self",
            response: {treeId: "powerId", parentId: "parentId", title: "powerName"},
        });

        form.on('submit(power-save)', function (data) {
            let param = dtree.getCheckbarNodesParam("role-power");
            let ids = '';
            for (let i = 0; i < param.length; i++) {
                let id = param[i].nodeId;
                ids += id + ',';
            }
            ids = ids.substr(0, ids.length - 1);
            data.field.roleId = [[${roleId}]];
            data.field.powerIds = ids;


            $.ajax({
                url: '/yyyyy',
                data: data.field,
                dataType: 'json',
                type: 'put',
                success: function (result) {
                    if (result.code==200) {
                        layer.msg(result.msg, {icon: 1, time: 1000}, function () {
                            parent.layer.close(parent.layer.getFrameIndex(window.name));
                        });
                    } else {
                        layer.msg(result.msg, {icon: 2, time: 1000});
                    }
                }
            })
            //
            return false;
        });

        //重置树形图
        $(document).on("click","#resetBtn",function (){
            DemoTree.cancelCheckedNode()
        })
    })