Asp.net mvc 按DataTextField排序Kendo MultiSelect选定的项目

我们在mvc包装器中使用剑道多选。设置中的所有内容都可以正常工作，但所选项目按数据值字段排序。我只是希望它们按数据文本字段排序，但到目前为止没有任何效果

@(Html.Kendo().MultiSelectFor(m => m.SelectedPersonIds)
      .HtmlAttributes(new { style = "width: 400px" })
      .DataTextField("Name")
      .DataValueField("PersonID")
      .Filter("contains")
      .Height(400)
      .DataSource(ds =>
      {
       ds.Read(read =>
        {
            read.Action("GetPersons", "Person", new { area = "" });
        });
      })
      .ItemTemplateId("detailTemplate")
      .TagTemplateId("valueTemplate")
)

这是工作版本。我试着加上

ds.Custom().Sort(s => s.Add("Name").Ascending());

和其他方法，但仍然没有运气。来自服务器的初始数据将被排序，因此您从中选择的列表将按名称进行完美排序

如何实现所选项目也按名称而不是ID排序？

---

提前谢谢。

我不知道是否有ASP.NET解决方案，但我可以给你JavaScript来解决它：

function onMultiselectChange(e) {
        e.sender.tagList.find('> li').sort(function (a, b) {
            return $(a).text() > $(b).text();
        }).appendTo(e.sender.tagList);
    }
});

您可以将其应用于ASP.NET multiselect，如下所示：

.Events(e =>
    {
        e.Change("onMultiselectChange")
    })

---

不要手动重新排列DOM元素。这样做将破坏显示的项目和内部数据之间的映射。移动元素后，取消选择一个项将导致在基础数据中取消选择另一个数据项，并且绑定回服务器将产生错误的结果

这里有一种正确的排序方法，假设值字段是“PersonID”，但您希望它按“Name”排序

---

最好有更复杂、更高效的方法对所选项目进行排序请记住，这将只对标记列表进行排序，但不会改变底层数据结构。从multiselect中删除标记时，可以在对标记列表排序后，根据原始索引和当前索引从实际multiselect中删除不同的项。这样一来，您看到的标记列表与底层数据结构不同，底层数据结构是在表单中使用时发送回服务器的数据结构。

function orderMultiSelect(multi) {
    const dataItems = multi.dataItems();
    dataItems.sort(
        (a, b) => {
            const textA = a.Name;
            const textB = b.Name;
            return (textA < textB) ? -1 : (textA > textB) ? 1 : 0;
        }
    );
   const values = dataItems.map(di => di.PersonID);
   multi.value(values);
}

function onMultiselectChange(e) {
    orderMultiselect(e.sender);
}

@(Html.Kendo().MultiSelectFor(m => m.SelectedPersonIds)
    .HtmlAttributes(new { style = "width: 400px" })
    .DataTextField("Name")
    .DataValueField("PersonID")
    .Filter("contains")
    .Height(400)
    .DataSource(
        ds =>
        {
           ds.Read(
              read =>
                  read.Action("GetPersons", "Person", new { area = "" })
             );
        }
      ).ItemTemplateId("detailTemplate")
      .TagTemplateId("valueTemplate")
      .Event(
          e => 
            e.DataBound("onMultiselectChange")
              .Change("onMultiselectChange")
      )
)