dataItem(element) returns KendoDraggable 中的不正确项目 - KendoUI JQuery

Question

我在 kendo 网格行上定义了一个可拖动对象，例如：

$(grid.element).kendoDraggable({
    filter: "table > tbody > tr.grid-row.k-master-row",
    group: "grid-items",
    hint: function (element) {
        grid.collapseRow(element);
        element.addClass("k-state-selected");
        var template = kendo.template($("#grid-item-moving-template").html());
        console.log(element);
        var data = grid.dataItem(element);
        console.log(data);
        var hint = $(template(data));
        return hint;
    },
    cursorOffset: { top: 15, left: 30 }
});

我注意到如果我开始拖动项目，第一个项目会正确显示，但如果我将第一个项目放入拖放区并开始拖动第二个项目，第二个项目的提示模板包含第一个项目的定义。

这就是奇怪的部分所在，我在提示函数 2 控制台日志中添加了定义，一个是传递的元素，另一个是从使用 dataItem() 获取的网格返回的实际数据。虽然元素总是正确的，但如果我开始拖动 1，我得到 1，如果我开始拖动 2，我得到 2，1 和 2 的 dataItem(element) 总是 returns 第 1 行的行数据（但这种情况发生仅当第一个项目已经被放入 dropzone 时）。知道为什么会这样吗？这是一个 kendo 内置函数。

Answer 1

我发现了问题。

每当物品掉落时，我都会打电话给：

e.draggable.currentTarget.remove();

在 Droppable 上，为了将其从包含的网格中删除，但由于网格的数据源未刷新，项目将从网格中消失，但它们仍将包含在数据源中。在 Kendo 下，dataItem() 将根据其数组索引查找项目，因为我们在网格上有 2 个项目，但在删除后数据源上有 3 个项目，这将导致索引不匹配（因为之前的索引数据源持有的现在被不同的项目占用）。

我个人认为 telerik 应该考虑使用 guid 键而不是原始数组索引对其进行索引，这样就不会出现此类问题。

我现在将回调向下传递到包含 droparea 调用的闭包：

    refreshGrid: function () {
        grid.dataSource.read();
        grid.refresh();
    }

问题就解决了。

dataItem(element) returns KendoDraggable 中的不正确项目 - KendoUI JQuery

dataItem(element) returns incorrect item inside of KendoDraggable - KendoUI JQuery

javascript

jquery

kendo-ui

kendo-grid

kendo-draggable