Kendo ui 如何在网格列中使用剑道自动完成

我正在尝试将剑道UI网格列从下拉列表转换为剑道自动完成。我使用的是MVVM模式，找不到任何与我类似的示例。以下是我到目前为止的情况：

在我的视图模型中：

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 #" },

我可以输入“建议的供应商”字段，它看起来像一个自动完成的字段，但从不返回和显示数据。如果问题不是很明显，我可以试着编一把小提琴

编辑：

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);

    }

suggestedVendorDropdownEditor:函数（容器、选项）{
$('')
.appendTo（容器）.kendoAutoComplete({
数据源：viewModel.suggestedVendorDropDownDataSource，
dataTextField:“建议的供应商”，
dataValueField:“建议的供应商”
});
var autoComplete=$（“#selectedItem”）.data（“kendoAutoComplete”）；
自动完成列表宽度（300）；
}

我是从拉尔斯的评论中得到建议后才明白这一点的。代码如下：

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);

}

suggestedVendorDropdownEditor:函数（容器、选项）{
$('')
.appendTo（容器）.kendoAutoComplete({
数据源：viewModel.suggestedVendorDropDownDataSource，
dataTextField:“建议的供应商”，
dataValueField:“建议的供应商”
});
var autoComplete=$（“#selectedItem”）.data（“kendoAutoComplete”）；
自动完成列表宽度（300）；
}

你说“它从不返回任何数据”是什么意思？一个问题是，您试图将dataBind定义为自动完成上不存在的一个选项-您应该将其放在您创建的输入html中（data bind=“value:”+options.field+”；可能需要一个演示help@Lars霍普纳，谢谢你指出我的错误，它帮助我找到了如何实现我所需要的。我编辑了我的帖子以包含我找到的解决方案。您应该将其作为答案发布，这样人们就知道您不再需要无效答案。自动完成小部件没有“dataValueField”选项