javascript - Kendo UI TreeView 节点在拖放后丢失自定义分配的 HtmlAttributes

Question

我已经为我的每个树节点分配了一个 ID 属性，以保留我在 Controller 上需要的信息，以便我可以保存修改后的层次结构。

但是，当我删除一个节点时，Id 属性将被删除。我不确定这是否是一个错误，我是否做错了什么，或者这是否按开发人员的预期工作。

我附上了我的警报窗口的屏幕截图(下面的代码)，以及从 Firebug 生成的 Html 的两张截图。一张在 Drop 之前，一张在 Drop 之后。

@(Html.Kendo().TreeView()
.Name("CompanyHierarchy")
.Events(events => events
    .DragEnd("HierarchyDragEnd")
)
.BindTo(Model.Hierarchy as System.Collections.IEnumerable, mappings =>
{
    mappings.For<Models.EnterpriseChildModel>(binding => binding
        .Children(c => c.Children)
        .ItemDataBound((item, c) =>
        {
            item.Text = c.Name;
            item.HtmlAttributes.Add("Id", c.EnterpriseID.ToString());
        })
    );
})
.DragAndDrop(true))

Answer 1

我有一个解决方案。它是由 Telerik 团队成员在 Kendo 论坛上提供的。我也会在下面发布我修改过的代码:

The HtmlAttributes are not persisted after drag&drop operations. In this particular case, it is best to add the Id to the item and access it through the dataItem method on the client.

修改后的代码:

为dataItem添加ID:

    @(Html.Kendo().TreeView()
    .Name("CompanyHierarchy")
    .Events(events => events
        .DragEnd("HierarchyDragEnd")
    )
    .BindTo(Model.Hierarchy as System.Collections.IEnumerable, mappings =>
    {
        mappings.For<Models.EnterpriseChildModel>(binding => binding
            .Children(c => c.Children)
            .ItemDataBound((item, c) =>
            {
                item.Text = c.Name;
                item.Id = c.EnterpriseID.ToString();
            })
        );
    })
    .DragAndDrop(true)
)

从dataItem获取信息:

        function HierarchyDragEnd(e) {
        setTimeout(function () {
            var originDataItem = $("#CompanyHierarchy").data('kendoTreeView').dataItem(e.sourceNode);
            var originNodeId = originDataItem.id;
            var originNodeText = originDataItem.text;
            var destinationDataItem = $("#CompanyHierarchy").data('kendoTreeView').dataItem(e.destinationNode);
            var destinationNodeId = destinationDataItem.id;
            var destinationNodeText = destinationDataItem.text;

            var dropPosition = e.dropPosition;
        }, 100);
    }