Каков правильный способ фильтрации сетки кендо с помощью нокаутов?

Как правильно отфильтровать сетку с помощью kendoGrid а> привязка?

В настоящее время я фильтрую сетку, привязывая ее к вычисляемому массиву, используя метод, показанный здесь: Вспомогательные функции в KnockoutJS — см. «Фильтрация массива».

self.filteredItems = ko.dependentObservable(function() {

    var filter = self.filter().toLowerCase();
    if (!filter) {
        return self.items();
    } else {
        return ko.utils.arrayFilter(self.items(), function(item) {
             return item.name().toLowerCase().indexOf(filter) !== -1;
        });
    }
}, self);

Это работает, однако, если вы не находитесь на странице № 1, она не сбрасывает сетку на страницу № 1, поэтому, если «страниц» результатов меньше, чем то, что заканчивается вашим поиском, сетка будет пустой до тех пор, пока не будет постранично. Страница 1.

Чтобы увидеть проблему, 1. перейдите на этот JSFIDDLE - http://jsfiddle.net/xW9yc/11/ 2. перейти на страницу 3 3. ввести "P" в поле поиска


kendo-grid kendo-ui knockout.js knockout-kendo
person user210757    schedule 08.05.2014    source источник
comment
Вы хотите, чтобы сетка начиналась со страницы 1 при применении какого-либо фильтра или просто переходила на последнюю доступную страницу?   -  person thispatchofsky    schedule 08.05.2014

Ответы (2)


arrow_upward
3
arrow_downward

Вы можете сохранить ссылку на сетку в наблюдаемой модели вашего представления следующим образом:

function ViewModel() {
    // ....
     self.grid = ko.observable();
}

и ваш HTML будет

<div data-bind="kendoGrid: {data:filteredItems, pageable: { buttonCount: 5, pageSize: 5 }, widget: grid }" />

Теперь, когда сетка создана, вы можете ссылаться на нее с помощью self.grid() вместо $("#MyGrid").data("kendoGrid") — это более слабая связь между вашей моделью представления и вашим представлением, поскольку вам не нужно жестко кодировать селектор jQuery.

Я обновил вашу скрипту, чтобы отразить эти изменения.

Вы можете найти документацию для параметра widget внизу этой страницы в Knockout- Документация по кендо

person rwisch45    schedule 08.05.2014
comment
Это хорошо — я нигде не вижу установки self.grid — как это происходит?! Я не смог найти документ по тегу виджета - person user210757; 09.05.2014
comment
@ user210757 self.grid просто объявляется пустым наблюдаемым в модели представления, а затем в HTML добавление widget: grid заполняет наблюдаемое при создании экземпляра сетки кендо. Я использовал grid в качестве имени переменной — хотя это может быть что угодно. Я поищу некоторые документы по параметру widget и опубликую их здесь, если найду что-нибудь - person rwisch45; 09.05.2014
comment
@ user210757 См. Мое редактирование ответа для ссылки на документацию. - person rwisch45; 09.05.2014

arrow_upward
1
arrow_downward

Если вы не против использовать javascript api кендо, вы можете сделать следующее:

var grid = $("#MyGrid").data("kendoGrid");
            if(grid)
            {
            grid.dataSource.page(1);
            }

[отредактированный jsfiddle] (http://jsfiddle.net/3CrMR/)

Надеюсь, это поможет!

person thispatchofsky    schedule 08.05.2014
comment
Единственное, против чего я выступаю, это то, что ViewModel напрямую взаимодействует с View. ViewModel, вероятно, не должен знать о #MyGrid. Если бы был способ вызвать это строго из представления, это сработало бы лучше. Спасибо за ответ! - person user210757; 09.05.2014
comment
я бы принял оба ответа, если бы мог, так как это было сотрудничество двух, которые я использовал. это определенно была огромная помощь, спасибо - person user210757; 09.05.2014