Question

我有一个双重列表（彼此连接），其中第一个可以放到第二个。请参阅下面的我的小提琴链接以了解.. 在初始屏幕上单击“运行process_test_json”按钮，此处显示列表。如果拖动到第二个列表，每个元素都会带有删除图标。删除按钮具有单击事件，它将元素发送回其原始位置。

所有设置，每件事情都运行正常但是在第二元素的情况下，由于它有子列表＆gt;子列表而无法移动。

请建议我可以通过适当的缩进按升序重新排列的代码，随时编辑我的小提琴。

删除会将元素发送回其先前的原始位置。假设我将第2个元素从第1个列表移动到第2个列表，然后在最后删除第二个元素，并在这里看到不正确的层次结构。

列表应如下所示：CORRECT IMAGE result screen 请在我的FIDDLE fiddle code

上发表此评论后更新代码

//////////////////////////////////////////////////////////////////////////////////////////////////////////////Statement to make hierarchy of the elements///////////////////////////////////////////////////////////////////////

Answer 1

解决了上述问题。

如果单击“删除”按钮，

每个元素在其原始位置都会反转，这个功能会起作用，

reArangeList: function(elem){
    var that = this;
    var parentIndexData = that.splitMultiple(String(elem.data('index')),'_'); 
    var updatedIndex = [];
    var joinValues;
    var superContainer = $(elem).attr('superContainer');
    for(var i=0; i<parentIndexData.length-1; i++){
        updatedIndex.push(parentIndexData[i]);
    }
    joinValues = updatedIndex.join('_');
    //var currentParent = $("."+superContainer+" li[data-index='" + joinValues + "' ]>ol")
    //console.log(currentParent.find('li').length)
    $("."+superContainer+" li[data-index='" + joinValues + "' ]>ol").append(elem);

},

代码如下：

//////////////////////////////////////////////////////////////////////////////////////////////////////////////
    //call the Function it will Rearrange Element according to previous format
    //////////////////////////////////////////////////////////////////////////////////////////////////////////////


    $("."+superContainer).find('li').each(function(){
        if(String($(this).data('index')).split('_').length > 1){
            // Function Will Rearrange List
            mostParentContext.reArangeList($(this));
            mostParentContext.appendDivInSpanFn($("."+superContainer));
        }
    })

具有删除和重新排列元素的可排序双列表到适当的层次结构

1 个答案: