Question

我正在构建网页，并且作为数据库，我使用mongodb（猫鼬）。我在一页上列出了一些文档（ID，日期，状态等）。然后，我可以单击该项目以查看更多详细信息。在该页面上，我添加了一个下拉菜单来更改某些值。当我更改一个值（ajax放置请求->猫鼬findByIdAndUpdate），然后返回到列表页面时，我的列表顺序已更改。然后，我更改的项目就是列表中的第一项。

我的for循环以创建列表：

<div id="simpleList" class="list-group">
    <% items.forEach(function(item) { %>
    <div class="box-item list-group-item">

        <div class="box-normal row-1 margin-left filtered">
            <p><%= item.itemId %></p>
        </div>

        <div class="box-normal row-1 margin-left filtered">
            <p><%= item.projectName %></p>
        </div>

        <a id="link-text" class="bold row-1 align-right" href="srequest/<%= item.itemId %>">More details</a>
        <p class="row-1 icon-drag">
            <span class="my-handle"><i class="fas fa-arrows-alt-v fa-3x" title="Move item"></i></span>
        </p>

    </div>
    <% }); %>
</div>

SortableJS列表的代码：

<script>
Sortable.create(simpleList, { 
    store: {
  filter: '.filtered', // 'filtered' class is not draggable
  handle: '.my-handle',
  animation: 0,

        /**
         * Get the order of elements. Called once during initialization.
         * @param   {Sortable}  sortable
         * @returns {Array}
         */
        get: function (sortable) {
            var order = localStorage.getItem(sortable.options.group.name);

            return order ? order.split('|') : [];
        },
        /**
         * Save the order of elements. Called onEnd (when the item is dropped).
         * @param {Sortable}  sortable
         */
        set: function (sortable) {
            var order = sortable.toArray();

            localStorage.setItem(sortable.options.group.name, order.join('|'));
        }
  }
 });

</script>

即使我使用“ disable：true”选项禁用了可排序功能，当我更新某些内容时，该项目仍将成为第一个项目。

我想更新的项目将被视为新项目，因此会移至列表顶部。在离开该页面之前，有没有办法存储列表的顺序？

在此先感谢您的帮助！

BR 基督徒

SortableJS：项目在放置请求后更改位置

0 个答案: