KendoUI Grid Multi Filter Checkbox from datasource

Question

Я использую сетку KendoUI, я хочу добавить фильтры checkbox в свою сетку. Проблема в том, что я хочу, чтобы фильтр отображал конкретное поле из моего источника данных, но фактически фильтровал его в поле id.

Мой код:

var ds = [{country: "BG", id: 1},{country: "GRM", id: 2}, {country: "USA", id: 3}]; 

$("#grid").kendoGrid({ 
    columns: [ { 
    field: "id", 
    template: "${ SetDisplayText(id)}", 
    filterable: { 
     multi:true, 
     dataSource: ds 
    } 
    } ], 
filterable: true, 
    dataSource: ds 
}); 


function SetDisplayText(matchId) { 
     var matchSite = $.grep(ds, function(item) { 
      return item.id === matchId; 
     }); 

     if (matchSite.length > 0) { 
      return matchSite[0].country; 
     } else { 
      return ""; 
     }  
} 

Как вы можете видеть, что я хочу отобразить название страны в фильтре, но на самом деле использовать его идентификатор в поле фильтра.

Пожалуйста, см: http://dojo.telerik.com/ihECE/2

Answer 1

Я думаю, вы можете атаковать проблему неправильно, но я не уверен, если вы просто упрощаю вопрос для вашей реальной проблемы.

Если идентификаторы уникальны для каждой страны, то просто укажите страну в своей сетке вместо идентификатора. Если вам нужны идентификаторы после того, как пользователь отфильтровал набор данных, вы можете получить к ним доступ, используя что-то вроде this. Это еще проще, если serverPaging является ложным.

Answer 2

Лучшее решение, которое я мог придумать, заключалось в использовании шаблона в фильтре. Например.

multi: true, 
dataSource: ds, 
itemTemplate: function (e) { 
       return "<span><label><span class='multiFilter'>#= data.DisplayField || data.all #</span><input type='checkbox' name='" +e.field + "' value='#= data.ValueField == 0 ? null : data.ValueField #'/></label></span>"; 
} 

Надеюсь, это поможет кому-то еще.