2014-07-10 28 views
1

我有列定義與模板:「object.type」,它是下拉列表(有多種類型進行搜索)。kendo-grid:不能過濾列是下拉列表

它具有編輯:

   editor : function (container, options) { 
         $('<input data-text-field="display" data-value-field="id" data-bind="value:' + options.field + '"/>') 
          .appendTo(container) 
          .kendoDropDownList({ 
           index: 0, 
           dataTextField: "display", 
           dataValueField: "id", 
           dataSource: usergroupConf.permissions 
          }); 
        }, 

所以此列元件是具有鍵ID和顯示,例如對象該列

{ 
    "id":"1", 
    "display":"Big" 
} 

現在,我已經定義過濾特性:

   filterable : { 
        extra : false, 
        ui : function(element) { 
         element.kendoDropDownList({ 
          index: 0, 
          dataTextField: "display", 
          dataValueField: "id", 
          dataSource: usergroupConf.permissions 
         }); 
        } 
       } 

當我點擊過濾箱它顯示過濾器很好,但是當我從中選擇一些值,我得到錯誤:

總之
Uncaught TypeError: undefined is not a function 

所以,

如何在劍道的網格過濾列這是博士opdowns?

回答

2

因此,經過大量研究後,結果正在跟隨。在劍道網格中使用外鍵。

  1. 創建附加字段,該字段是關鍵在 下拉
  2. 爲其選擇將被結合到下拉該列,板條箱編輯器中的值,並且它 將改變這個新的字段

     { 
          field: 'permission_id', 
          title : 'Permission', 
          // values : usergroupConf.permissions, 
          template : "#= permission.display #", 
          editor : function (container, options) { 
           // bind it to permission, but update permission_id as well (because of enabled filtering) 
           $('<input data-text-field="display" data-value-field="id" data-bind="value:permission"/>') 
            .appendTo(container) 
            .kendoDropDownList({ 
             index: 0, 
             dataTextField: "display", 
             dataValueField: "id", 
             dataSource: usergroupConf.permissions, 
             select : function(e) { 
              options.model.permission_id = this.dataItem(e.item.index()).id; 
             } 
            }); 
          }, 
          filterable : { 
           extra : false, 
           ui : function(element) { 
            element.kendoDropDownList({ 
             dataSource: usergroupConf.permissions, 
             dataTextField: "display", 
             dataValueField: "id", 
             optionLabel: "--Select Value--" 
            }); 
           } 
          } 
         }, 
    
  3. 這是數據源

    dataSource: new kendo.data.DataSource({ 
         // pageSize: 10, 
         serverPaging: false, 
         schema: { 
          model: { 
           id : 'id', 
           fields: { 
            'id' : {}, 
            'name' : { 
             editable : false, 
             nullable : false 
            }, 
            'permission' : { 
             editable : true 
            }, 
            'permission_id' : { // we'll have permission_id to enable filter (kendo doesn't support filtering through objects (what permission column is) by default) 
             editable : true, 
             type : 'number' 
            } 
           } 
          } 
         }, 
    

所以最後,填充數據時,你必須添加權限的對象:

{ 
    "id":1 
    "display":"Move" 
} 

permission_id:1