7

したがって、タイトルはほとんどすべてを物語っています。新しい MultiSelect ウィジェットを Grid のカスタム ポップアップ エディター テンプレートに取り込もうとしています。

Data Attribute Initialization メソッドを使用して、リモートの dataSource からドロップダウン オプションを読み取っています。これはすべて正常に機能していますが、選択したアイテムの値をモデルに取得できません。

行を保存すると、選択した値のコンマ区切りのリストではなく、MultiSelect で選択された最初のデータ項目を表すデータの配列がサーバーに送信されます。

MultiSelect 値 (選択した値のリスト/配列) をグリッド モデルに取得する方法はありますか?

ありがとう

編集:回避策を使用しましたが、グリッドで MultiSelects を使用する「適切な方法」があるかどうか知りたいです。

回避策は、グリッドの構成に次のようなものを追加することです。

save: function(e) { 
    e.model.items = $('#select_items').data("kendoMultiSelect").value();
}

これは、ポップアップ エディター テンプレートの関連部分です。

<input name="select_items" id="select_items" data-value-field="id" 
data-text-field="description" data-source="itemsDataSource" 
data-role="multiselect" data-auto-bind="false" data-item-template="itemList">

select_itemsモデル定義に含まれていません。上記の回避策を使用しitemsて、モデルにある MultiSelect の値をコピーしています。これは機能しているようですが、なぜ必要なのかわかりません。

4

1 に答える 1

13

グリッドで使用MultiSelectするには、考慮すべきいくつかの質問があります。

  1. stringグリッド エディタは、列、booleannumberおよびのタイプとしてのみサポートしますdate。の配列を保存したいので、stringこれを回避する必要があるとしましょう。
  2. サーバーから値の配列を受け取っているため、サーバーから受け取った値を表示するには、 を使用してtemplateにシリアル化する必要stringがあります。
  3. KendoUI は、MultiSelect を入力として使用することを推測できないため、提供してeditor機能させる必要があります。

これらすべての質問に対処しましょう。

array最も簡単な解決策の問題を解決するにはstring、KendoUI に何を受け取っているかについて何も言わないことです。

についてはtemplate、JavaScriptjoinメソッドを使用して、「,」で区切られたすべての値をまとめます。何かのようなもの:

{ field: "Cities", template: "#= Cities.join(', ') #" }

最後に、エディターについては、次を使用します。

{ field: "Cities", template: "#= Cities.join(', ') #", editor : citiesEditor }

function citiesEditor(container, options) {
    $("<select multiple='multiple' data-bind='value : Cities'/>").appendTo(container).kendoMultiSelect({
        dataSource: citiesDS
    });
}

私の場合は、有効な都市の名前が付いた単なるcitiesDSのです。arraystring

var citiesDS = [
    "Boston", "Kirkland", "London", "New York", "Philadelphia", "Redmond", "Seattle", "Tacoma"
];

更新(保存)すると、フィールドarrayに導入された都市を含む文字列がホストに送信されCitiesます。

例:こちらhttp://jsfiddle.net/OnaBai/Q2w7z/

于 2013-07-16T10:30:27.377 に答える