KendoUI网格应用过滤器下拉选项选择

Question

我有一个可过滤的列使用下拉菜单作为模板，用户可以选择一个选项来过滤。

我该如何过滤选择该选项的时刻，而不是用户必须在选择完成后点击过滤按钮？

我的下面的代码不起作用。进行选择的时候，网格将不刷新，并重置下拉选择。

对于我的下拉我有：

function salesPersonFilter(element) 
{ 
    element.kendoDropDownList({ 
    dataSource: [{Id: 0, Name: 'Jimbo Jones'}, {Id: 1, Name: 'Jimmy'}], 
    dataTextField: 'Name', 
    dataValueField: 'Name', 
    optionLabel: 'Select salesperson', 
    template: '#="<span class=\'filterTrigger\'>"+Name+"</span>" #' 
    }) 
} 

我已绑定一个click事件filterTrigger类：

$('.k-list .filterTrigger').click(function() 
{ 
    applyFilters(); 
}) 

我包括applyFilters（）函数作为参考：

function applyFilters() // Custom filters... 
{ 
    var dupes = {}; 
    var finalFilters = []; 

    $.each(filterBus, function(i, el) { 
    if(!dupes[el.field]) 
    { 
     dupes[el.field] = true; 
     finalFilters.push(el); 
    } 
    }); 

    filterBus = finalFilters ; 

    grid.dataSource.filter(finalFilters) ; 
} 

Answer 1

我设法这样做，但肯定有更好的方法吗？：

function salesPersonFilter(element) 
    { 
    element.kendoDropDownList({ 
     dataSource: [{Id: 60, Name: 'Sam'}, {Id: 5, Name: 'Jimmy'}], 
     dataTextField: 'Name', 
     dataValueField: 'Id', 
     optionLabel: 'Select salesperson', 
     template: '#="<span class=\'filterTrigger\' data-value=\'"+Id+"\'>"+Name+"</span>" #', 
     select: function(e) 
     {// Dirty, is there a better way? 
     html = e.item[0].outerHTML; 
     html = html.substring(html.indexOf('data-value="')+12); 
     traderId = html.substring(0, html.indexOf('"')); 

     filterBus.push({ 
      field: 'traderId', 
      operator: 'eq', 
      value: traderId 
     }) 
     $('.k-animation-container').hide(); 
     grid.dataSource.filter(filterBus); 
     } 
    }) 
    }