Nestable插件

Question

解决

我有一个问题。

可以在“展开”和“折叠”中使用带有jQuery Cookie的Nestable jQuery插件吗？ 要记住“展开”和“崩溃”的位置。

链接到脚本：Nestable jQuery Plugin

谢谢你的回答！

这是带有Cookie保存的脚本：

expandItem: function(li)
    {
        li.removeClass(this.options.collapsedClass);
        li.children('[data-action="expand"]').hide();
        li.children('[data-action="collapse"]').show();
        li.children(this.options.listNodeName).show();
        if(getCookie("tree") != null){
            var CookieValue = getCookie("tree") + li.attr('data-id') + ",";
        }
        else{
            var CookieValue = li.attr('data-id') + ",";
        }
        $.cookie("tree", CookieValue, {expires:3600, path:'/administrator/'});
    },

    collapseItem: function(li, a)
    {
        var lists = li.children(this.options.listNodeName);
        if (lists.length) {                
            li.addClass(this.options.collapsedClass);
            li.children('[data-action="collapse"]').hide();
            li.children('[data-action="expand"]').show();
            li.children(this.options.listNodeName).hide();
            if(getCookie("tree") != null){
                var CookieValueArray = getCookie("tree").split(",");
                for(i=0;i<CookieValueArray.length;i++){
                    if(CookieValueArray[i] == li.attr('data-id') && a == true){
                        li.children('[data-action="expand"]').hide();
                        li.children('[data-action="collapse"]').show();
                        li.children(this.options.listNodeName).show();
                    }
                }
                if(a != true){
                    var CookieValue = "";
                    for(i=0;i<CookieValueArray.length-1;i++){
                        if(CookieValueArray[i] != li.attr('data-id')){
                            CookieValue += CookieValueArray[i] + ",";
                        }
                    }
                    if(CookieValue == ""){
                        $.cookie("tree", "", {expires:-1, path:'/administrator/'});
                    }
                    else{
                        $.cookie("tree", CookieValue, {expires:3600, path:'/administrator/'});
                    }
                }
            }
        }
    },

Answer 1

是。

我认为您必须通过添加折叠状态来更改序列化功能。

serialize: function()
    {
        var data,
            depth = 0,
            list  = this;
            step  = function(level, depth)
            {
                var array = [ ],
                    items = level.children(list.options.itemNodeName);
                items.each(function()
                {
                    var li   = $(this),
          // Check if dd-collapse is part of the class of the <li> element
                        var collapsed = "open";
                        if(li.hasClass( "dd-collapsed" ){
                          collapsed = "collapsed";
                        }
                        item = $.extend({}, li.data(), collapsed),
                        sub  = li.children(list.options.listNodeName);
                    if (sub.length) {
                        item.children = step(sub, depth + 1);
                    }
                    array.push(item);
                });
                return array;
            };
        data = step(list.el.find(list.options.listNodeName).first(), depth);
        return data;
    }

然后，在展开/折叠事件上编写cookie（cookie内容将是序列化字符串）：

expandItem: function(li)
    {
        li.removeClass(this.options.collapsedClass);
        li.children('[data-action="expand"]').hide();
        li.children('[data-action="collapse"]').show();
        li.children(this.options.listNodeName).show();
        $.cookie("your_cookie", this.serialize());
    },

    collapseItem: function(li)
    {
        var lists = li.children(this.options.listNodeName);
        if (lists.length) {
            li.addClass(this.options.collapsedClass);
            li.children('[data-action="collapse"]').hide();
            li.children('[data-action="expand"]').show();
            li.children(this.options.listNodeName).hide();
        }
        $.cookie("your_cookie", this.serialize());
    },

    expandAll: function()
    {
        var list = this;
        list.el.find(list.options.itemNodeName).each(function() {
            list.expandItem($(this));
        });
        $.cookie("your_cookie", this.serialize());
    },

    collapseAll: function()
    {
        var list = this;
        list.el.find(list.options.itemNodeName).each(function() {
            list.collapseItem($(this));
        });
        $.cookie("your_cookie", this.serialize());
    }

在你的课程中，你必须在可嵌套的之前加载jquery.cookie.js。

我没有尝试，但它在我脑海中起作用......;）