Kendo UI マルチセレクトのデフォルト選択方法

1. 静的なデフォルト選択: マルチセレクトを使用して事前に選択済みのアイテムを表示する場合、以下のように value プロパティを設定します。

$("#multiselect").kendoMultiSelect({
  value: ["item1", "item2"] // デフォルトで選択されるアイテムの値を配列で指定
});

2. 動的なデフォルト選択: マルチセレクトのデフォルト選択を動的に設定する場合、以下のように setOptions メソッドを使用します。

var defaultSelection = ["item1", "item2"]; // 動的に選択するアイテムの値を配列で指定
$("#multiselect").data("kendoMultiSelect").setOptions({
  value: defaultSelection
});

3. データバインディングを使用したデフォルト選択: データバインディングを使用してマルチセレクトのデフォルト選択を行う場合、以下の手順を実行します。

• マルチセレクトの初期化時に dataTextField と dataValueField を設定します。
• データソースを定義し、選択済みのアイテムの値を含めます。
• value プロパティに選択済みアイテムの値を設定します。

<input id="multiselect" />
<script>
$("#multiselect").kendoMultiSelect({
  dataTextField: "text",
  dataValueField: "value",
  dataSource: [
    { text: "アイテム1", value: "item1" },
    { text: "アイテム2", value: "item2" },
    { text: "アイテム3", value: "item3" }
  ],
  value: ["item1", "item2"] // デフォルトで選択されるアイテムの値を配列で指定
});
</script>

上記のコード例では、3つの方法を示しています。静的なデフォルト選択では、初期化時に value プロパティを使用して選択済みのアイテムを指定します。動的なデフォルト選択では、setOptions メソッドを使用して動的に選択済みのアイテムを設定します。データバインディングでは、データソースとして選択済みのアイテムを含め、value プロパティで指定します。

これらの方法を使用することで、Kendo UI のマルチセレクトでデフォルトの選択を設定することができます。適切な方法を選んで、自分の要件に合わせて実装してください。