0

Kendo UI グリッド列をドロップダウンから Kendo AutoComplete に変換しようとしています。私は MVVM パターンを使用していますが、私のような例が見つかりません。これが私がこれまでに持っているものです：

私のviewModelでは：

viewModel = kendo.observable({
suggestedVendor: { "SuggestedVendor": "" },
suggestedVendorDropDownDataSource: new kendo.data.DataSource({
        ... returns a list of Suggested Vendors
  }),

suggestedVendorDropdownEditor: function (container, options) {

        var input = $("<input id='selecteditem' />");
        input.attr("SuggestedVendor", options.field);
        input.appendTo(container);
        input.kendoAutoComplete({
            dataSource: this.suggestedVendorDropDownDataSource,
            dataTextField: "SuggestedVendor",
            dataValueField: "SuggestedVendor",
            dataBind:"value:' + options.field + '"

        });

私のグリッドのフィールド:

{ field: "SuggestedVendor", 
  title: "Suggested Vendor", 
  editor: viewModel.suggestedVendorDropdownEditor, 
  template: "#= (data.SuggestedVendor == null) ? '' : data.SuggestedVendor #" },

提案されたベンダー フィールドを入力すると、オートコンプリートのように動作するように見えますが、データが返されません。問題がすぐに明らかにならない場合は、フィドルを作成してみることができます。

編集：

見つけたフィドルの助けを借りて、必要なことを行う方法を見つけました。私はそれをフォークしました。フィールドは異なりますが、必要なことは実行します。これが私が分岐したフィドルです。

最終的に、エディター コードを次のように変更しました。

 suggestedVendorDropdownEditor: function (container, options) {
        $('<input id= "selectedItem" data-bind="value: ' + options.field + ' "/>')
            .appendTo(container).kendoAutoComplete({
                dataSource: viewModel.suggestedVendorDropDownDataSource,
                dataTextField: "SuggestedVendor",
                dataValueField: "SuggestedVendor"
        });

      var autoComplete =$("#selectedItem").data("kendoAutoComplete");
      autoComplete.list.width(300);

    }
4

1 に答える 1

0

ラースさんのコメントからアドバイスをもらって解決しました。コードは次のとおりです。

suggestedVendorDropdownEditor: function (container, options) {
    $('<input id= "selectedItem" data-bind="value: ' + options.field + ' "/>')
        .appendTo(container).kendoAutoComplete({
            dataSource: viewModel.suggestedVendorDropDownDataSource,
            dataTextField: "SuggestedVendor",
            dataValueField: "SuggestedVendor"
    });

  var autoComplete =$("#selectedItem").data("kendoAutoComplete");
  autoComplete.list.width(300);

}
于 2014-02-14T15:56:00.380 に答える