Question

i'm making an relese access using Nestable List, And when i drop the item from List1 to List2 i have to save on database, so how i identify what item was dropped on List2?

This is my code:

        <div class="col-lg-6">
            <h3 class="droppTextCenter">Serviços Disponíveis</h3>
            <div class="dd" id="nestable">
                <script id="template" type="text/template7">
                    <ol class="dd-list">
                        {{#each Services}}
                        <li class="dd-item" data-id="{{Id}}">
                            <div class="dd-handle">
                                <div class="col-lg-9">
                                    {{Descryption}}
                                </div>
                            </div>
                        </li>
                        {{/each}}
                    </ol>
                </script>
            </div>
        </div>
        <div class="col-lg-6">
            <h3 class="droppTextCenter">Serviços Liberados para o Usuário</h3>
            <div class="dd" id="nestable2">
                <script id="template2" type="text/template7">
                    <ol class="dd-list">
                        {{#each ServicesReleased}}
                        <li class="dd-item" data-id="{{Id}}">
                            <div class="dd-handle">
                                <div class="col-lg-9">
                                    {{Descryption}}
                                </div>
                            </div>
                        </li>
                        {{/each}}
                    </ol>
                </script>
            </div>
        </div>

I'm using template7 to make the List.

So i will make an ajax method on nestable onChange to save it in database.

$('#nestable').nestable({
    maxDepth: 1,
    group: 1
}).on('change', updateOutput);

// activate Nestable for list 2
$('#nestable2').nestable({
    maxDepth: 1,
    group: 1
}).on('change', updateOutput);

This one will be the replace for updateOutput. When i move it, from List1 to List2 i have to save on database, but when i move from List2 to List1 i have to delete it from database.

function saveServicosLiberados() {
    $.ajax({
        url: "/Admin/MeusNegociosAcessos/SaveServicosLiberados",
        method: "POST",
        data: {
            Id: ????????
        },
        success: function (result) {
            var list = e.length ? e : $(e.target), output = list.data('output');

            if (window.JSON) {
                output.val(window.JSON.stringify(list.nestable('serialize')));
            } else {
                output.val('É necessario estár com um nevegador com suporte à JSON.');
            }
        }
    });
}

function deleteServicosLiberados() {
    $.ajax({
        url: "/Admin/Delete",
        method: "POST",
        data: {
            Id: ??????????
        },
        success: function (result) {
            var list = e.length ? e : $(e.target), output = list.data('output');

            if (window.JSON) {
                output.val(window.JSON.stringify(list.nestable('serialize')));
            } else {
                output.val('É necessario estár com um nevegador com suporte à JSON.');
            }
        }
    });
}

So, how i take the Id from the item dropped?

Answer 1

这是一个难以解决的问题（如果我做了......你告诉我）。

第一次我把Template7的难度放在一边我在这里Notepad++手动编码无论如何，这种HTML预处理器语法与问题的真实主题无关。

问题是如何保存列表项＆＃34;移动＆＃34;从列表到另一个列表，使用Nestable plugin，顺便说一下，自2014年8月以来没有维护 所以我为你做了两个例子。

One正在显示将ajax请求挂钩到 保存元素id的位置，从左侧列表中拖出 。
Second显示在更改时将ajax请求挂钩到 保存一个或两个列表 的位置。

我绝对没有触及插件代码...
它似乎完全有效。

此外，您的问题是关于如何使用它的结果所以我从this GitHub example而不是您的代码开始。

我找到了可以获取相关信息的位置，以便将其保存到DB。

所以看看两个笔。
如果有什么不清楚的话，请问我 ;）

我已离开所有相关的console.log()，以帮助了解正在发生的事情。

搞笑（？）轶事：今天我失去了3个小时，等待GitHub在 Dyn <上 DDoS攻击 中活着回来/ strong>，发布此答案。狗屎发生了！ ;）

How to get element dropped on Nestable List

1 个答案: