Kendo使用自定義編輯器進行內聯編輯不會綁定

Question

我正在試圖製作簡單的組合框內聯編輯器。我設法通過在kendoComboBox更改上添加一個愚蠢的解決方法來創建新的行，但更新仍然不起作用（除非您使用默認編輯器更改字段），而組合框也不顯示選定的值。

網：

$("#pseudo-category-grid").kendoGrid({ 
    dataSource: { 
     type: "json", 
     transport: { 
      // CRUD stuff.. 
     }, 
     schema: { 
      data: "Data", 
      total: "Total", 
      errors: "Errors", 
      model: { 
       id: "Id", 
       fields: { 
        PseudoCategory: {editable: true, type: "string" }, 
        PseudoCategoryId: {editable: true, type: "number" }, 
        DisplayOrder2: {editable: true, type: "number" }, 
        IncludeAllChildren: {editable: true, type: "boolean" } 
       } 
      } 
     }, 
     requestEnd: function(e) { 
      if(e.type=="update") { 
       this.read(); 
      } 
     }, 
     error: function(e) { 
      display_kendoui_grid_error(e); 
      this.cancelChanges(); 
     }, 
     pageSize: @(defaultGridPageSize), 
     serverPaging: true, 
     serverFiltering: true, 
     serverSorting: true 
    }, 
    pageable: { 
     refresh: true, 
     pageSizes: [@(gridPageSizes)] 
    }, 
    toolbar: [{ name: "create", text: "@T("Admin.Common.AddNewRecord")" }], 
    editable: { 
     confirmation: false, 
     mode: "inline" 
    }, 
    scrollable: false, 
    columns: [{ 
     field: "PseudoCategoryId", 
     title: "Pseudo Category", 
     editor: pseudoCategoryDropDownEditor, 
     template: "#:PseudoCategory#" 
    // other unrelated fields removed... 
    }, { 
     command: [{ 
      name: "edit", 
      text: { 
       edit: "@T("Admin.Common.Edit")", 
       update: "@T("Admin.Common.Update")", 
       cancel: "@T("Admin.Common.Cancel")" 
      } 
     }, { 
      name: "destroy", 
      text: "@T("Admin.Common.Delete")" 
     }], 
     width: 200 
    }] 
}); 

自定義編輯：

function pseudoCategoryDropDownEditor(container, options) { 
    $.ajax({ 
     cache: false, 
     type: 'POST', 
     url: '@Html.Raw(Url.Action("PseudoCategoryList", "Category"))', 
     dataType: 'json', 
     data: addAntiForgeryToken(), 
     success: function (data) { 
      $('<input required data-text-field="Name" data-value-field="Id" data-bind="value:PseudoCategoryId"/>') 
       .appendTo(container) 
       .kendoComboBox({ 
        autoBind: false, 
        dataSource: data.Data, 
        dataTextField: "Name", 
        dataValueField: "Id", 
        filter: "contains", 
        change: function(e) { 
         var value = this.value(); 
         options.model.PseudoCategoryId = value; 
         for (var i = 0; i < data.Data.length; i++) { 
          if (value == data.Data[i].Id) 
           options.model.PseudoCategory = data.Data[i].Name; 
         } 
        } 
       }); 
     }, 
     error: function (xhr, ajaxOptions, thrownError) { 
      alert('Failed to get pseudo categories'); 
     } 
    }); 
} 

電話@Html.Raw(Url.Action("PseudoCategoryList", "Category"))簡單地返回數據字段ID和姓名的數組。

Answer 1

設法得到它的工作由manually binding組合框模型：

function pseudoCategoryDropDownEditor(container, options) { 
    $.ajax({ 
     cache: false, 
     type: 'POST', 
     url: '@Html.Raw(Url.Action("PseudoCategoryList", "Category"))', 
     dataType: 'json', 
     data: addAntiForgeryToken(), 
     success: function (data) { 
      var elem = $('<input required data-text-field="Name" data-value-field="Id" data-bind="value:PseudoCategoryId"/>') 
       .appendTo(container) 
       .kendoComboBox({ 
        autoBind: false, 
        dataSource: data.Data, 
        filter: "contains" 
       }); 
      if (options.model.PseudoCategoryId == 0) 
       options.model.PseudoCategoryId = data.Data[0].Id; 
      kendo.bind(elem, options.model); 
     }, 
     error: function (xhr, ajaxOptions, thrownError) { 
      alert('Failed to get pseudo categories'); 
     } 
    }); 
}