如何为项目中的Kendo MultiSelect设置预选中值？

嘿，我来帮你搞定这个Kendo MultiSelect预选中的问题！根据你的初始化代码，我给你两种常用的实现方式，你可以根据自己的场景选：

方法一：初始化组件时直接指定预选中值 #

你可以在MultiSelect的配置项里直接加上value属性，传入一个包含目标PublicHouseId的数组就行。因为你的autoBind设为true，组件会自动在数据源加载完成后匹配这些ID并选中对应的选项。

修改后的代码示例：

$(document).ready(function () {
  $("#multiselect").kendoMultiSelect({
    placeholder: "--Select Public Houses--",
    dataTextField: "PublicHouseName",
    dataValueField: "PublicHouseId",
    autoBind: true,
    // 这里传入你需要预选中的PublicHouseId数组
    value: [1, 3, 5], 
    dataSource: {
      transport: {
        read: {
          dataType: "json",
          url: "/book/getallpublichouses"
        }
      }
    }
  });
});

注意：value数组里的元素类型必须和PublicHouseId的类型完全匹配——比如如果后端返回的PublicHouseId是字符串，那你得传["1", "3"]而不是数字数组。

方法二：初始化完成后动态设置预选中值 #

如果你的预选中值是在组件初始化之后才获取到的（比如从后端接口异步获取），可以先获取MultiSelect实例，再调用value()方法设置：

$(document).ready(function () {
  // 初始化组件并获取实例
  const multiSelect = $("#multiselect").kendoMultiSelect({
    placeholder: "--Select Public Houses--",
    dataTextField: "PublicHouseName",
    dataValueField: "PublicHouseId",
    autoBind: true,
    dataSource: {
      transport: {
        read: {
          dataType: "json",
          url: "/book/getallpublichouses"
        }
      }
    }
  }).data("kendoMultiSelect");

  // 假设这里是异步获取到的预选中ID数组
  const selectedIds = [2, 4];
  // 设置选中值
  multiSelect.value(selectedIds);
});

如果担心数据源还没加载完成就设置选中值（比如网络慢的情况），可以把设置逻辑放到dataBound事件里，确保数据加载完成后再执行：

$(document).ready(function () {
  $("#multiselect").kendoMultiSelect({
    placeholder: "--Select Public Houses--",
    dataTextField: "PublicHouseName",
    dataValueField: "PublicHouseId",
    autoBind: true,
    dataSource: {
      transport: {
        read: {
          dataType: "json",
          url: "/book/getallpublichouses"
        }
      }
    },
    // 数据绑定完成后触发
    dataBound: function() {
      const selectedIds = [2, 4];
      this.value(selectedIds);
    }
  });
});

这几种方式都能帮你实现预选中的需求，你根据自己的实际场景选就行～

内容的提问来源于stack exchange，提问作者Mikhail Kostiuchenko