Kendo Grid - 使用下拉列表編輯器編輯線條（編輯自定義編輯器）

Question

我正在使用示例Telerik this page提供的示例在Kendo UI網格內進行內聯編輯，我想綁定內聯下拉列表在「類別」列中「添加到JSON對象中，而不是使用它們在演示中使用的xml數據。當我使用JSON數據時，下拉列表不起作用。如何將JSON對象綁定到內聯放置-down名單？A fully working fiddle can be found here。

這裏是JavaScript函數結合的數據源。

function categoryDropDownEditor(container, options) { 
    var categories = { 
     'Category': [ 
      { 'CategoryName': 'Beverages', 'CategoryID': 1 }, 
      { 'CategoryName': 'Condiments', 'CategoryID': 2 }, 
      { 'CategoryName': 'Confections', 'CategoryID': 3 }, 
      { 'CategoryName': 'Dairy Products', 'CategoryID': 4 }, 
      { 'CategoryName': 'Grains/Cereals', 'CategoryID': 5 }, 
      { 'CategoryName': 'Meat/Poultry', 'CategoryID': 6 }, 
      { 'CategoryName': 'Produce', 'CategoryID': 7 }, 
      { 'CategoryName': 'Seafood', 'CategoryID': 8 } 
     ] 
    }; 

    $('<input required data-text-field="CategoryName" data-value-field="CategoryID" data-bind="value:' + options.field + '"/>') 
     .appendTo(container) 
     .kendoDropDownList({ 
      autoBind: false, 
      dataSource: categories 
     }); 
} 

Answer 1

試着改變以下。

var Category = 
[ 
      { 'CategoryName': 'Beverages', 'CategoryID': 1 }, 
      { 'CategoryName': 'Condiments', 'CategoryID': 2 }, 
      { 'CategoryName': 'Confections', 'CategoryID': 3 }, 
      { 'CategoryName': 'Dairy Products', 'CategoryID': 4 }, 
      { 'CategoryName': 'Grains/Cereals', 'CategoryID': 5 }, 
      { 'CategoryName': 'Meat/Poultry', 'CategoryID': 6 }, 
      { 'CategoryName': 'Produce', 'CategoryID': 7 }, 
      { 'CategoryName': 'Seafood', 'CategoryID': 8 } 
]; 

，並作爲數據源使用

$('<input required data-text-field="CategoryName" data-value-field="CategoryID" data-bind="value:' + options.field + '"/>') 
     .appendTo(container) 
     .kendoDropDownList({ 
      autoBind: false, 
      dataSource: Category 
     }); 

Answer 2

function categoryDropDownEditor(container, options) { 
    var categories = { 
     'Category': [ 
      { 'CategoryName': 'Beverages', 'CategoryID': 1 }, 
      { 'CategoryName': 'Condiments', 'CategoryID': 2 }, 
      { 'CategoryName': 'Confections', 'CategoryID': 3 }, 
      { 'CategoryName': 'Dairy Products', 'CategoryID': 4 }, 
      { 'CategoryName': 'Grains/Cereals', 'CategoryID': 5 }, 
      { 'CategoryName': 'Meat/Poultry', 'CategoryID': 6 }, 
      { 'CategoryName': 'Produce', 'CategoryID': 7 }, 
      { 'CategoryName': 'Seafood', 'CategoryID': 8 } 
     ] 
    }; 

    $('<input required data-text-field="CategoryName" data-value-field="CategoryID" data-bind="value:' + options.field + '"/>') 
     .appendTo(container) 
     .kendoDropDownList({ 
      autoBind: false, 
      dataSource: categories.Category 
     }); 
} 

看看上面，你需要使用屬性綁定到數據源。由於kendo數據源是一個Array對象。