Пользовательский интерфейс фильтра KendoUI Grid

Я пытаюсь реализовать пользовательский интерфейс фильтра с раскрывающимся списком с некоторыми фиктивными данными. Я следовал инструкциям на сайте кендо (http://demos.kendoui.com/web/grid/filter-menu-customization.html), но у меня это просто не работает :(.

Вот функция для пользовательского интерфейса:

function relStatFilter(element)
  {
    element.kendoDropDownList({
      dataSource: ["Prospect", "Customer"],
      optionLabel: 'Select status'
    })
  }

А вот параметры столбца, к которым он применяется:

...
{
            field: 'relStat', 
            filterable: 
            {
                ui: relStatFilter, 
                extra: false
            }, 
            title: '<abbr title=\'Relationship status\'>Rel stat</abbr>', 
            template: '#= ratio == 0 ? "<span class=text-info>Prospect</span>" : relStat == "Active" ? "<span class=text-success>Active</span>" : relStat == "At risk" ? "<span class=text-warning>At risk</span>" : "" #', 
        }, 
...

Когда я нажимаю фильтр, все, что я получаю, это стандартное «начинается с» и ввод текста.

Что я пропустил?


javascript jquery kendo-grid kendo-ui
person imperium2335    schedule 25.02.2013    source источник

Ответы (1)


arrow_upward
5
arrow_downward

Пользовательский интерфейс фильтрации доступен с 2012.3.1315. Убедитесь, что вы не используете более старую версию. При использовании 2012.3.1315 следующий код работает, как и ожидалось:

$("#grid").kendoGrid({
  dataSource: [ { name: "Foo" }, { name: "Bar" }],
  filterable: {
    extra: false,
    operators: {
      string: {
        eq: "Is equal to",
        neq: "Is not equal to"
      }
    }
  },
  columns: [
    {
      field: "name",
      filterable: {
        ui: function(element) {
          element.kendoDropDownList({
            dataSource: [ "Foo", "Bar"]
          });
        }
      }
    }
  ]
});

Вот живая демонстрация: http://jsbin.com/uwiqow/1/edit.

person Atanas Korchev    schedule 25.02.2013
comment
Спасибо, я не смог найти, где скачать эту версию, но я просто взял код, который они используют в своих примерах, и он отлично работает. - person imperium2335; 26.02.2013