Kendo UI очистить фильтр по полю

#javascript #kendo-ui #grid #datasource

#javascript #kendo-ui #сетка #источник данных

Вопрос:

У меня на странице есть сетка kendo. В этой сетке есть источник данных. И в этом источнике данных у меня есть множество сложных фильтров. Например:

http://s7.postimg.org/bmqxgp2ff/filters.png

И прежде чем я добавлю новый набор фильтров к своим фильтрам источника данных, мне нужно удалить все фильтры, например, где field= «fld_32».

Я думаю, что это можно сделать с помощью рекурсии, но в grid есть компонент фильтра, у которого есть кнопка «Очистить», а кнопка очистить делает то же самое, что мне нужно. Но я понятия не имею, как это работает и как вызвать это программно.

Ответ №1:

Я расширяю kendoGrid методом для удаления всех фильтров в сетке:

 kendo.ui.Grid.prototype.clearFilters = function(args){
// MODIFY THIS PART
    var ignore = [];
    // test arguments
    if(typeof args === 'object'){
        if(args.hasOwnProperty('ignore')){
            if(args.ignore.length > 0){
                ignore = args.ignore;
            }
        }
    }

// get dataSource of grid and columns of grid
var fields = [], filter = this.dataSource.filter(), col = this.columns;
if( $.isEmptyObject(filter) || $.isEmptyObject(filter)) return;

// Create array of Fields to remove from filter and apply ignore fields if exist
for(var i = 0, l = col.length; i < l; i  ){
    if(col[i].hasOwnProperty('field')){
        if(ignore.indexOf(col[i].field) === -1){
            fields.push(col[i].field)
        }
    }
}
// MODIFY THIS PART END

if($.isEmptyObject(fields)) return;

// call "private" method
var newFilter = this._eraseFiltersField(fields, filter)

// set new filter
this.dataSource.filter(newFilter);
}
  

И вот второй метод. Он отделен, потому что его можно вызывать рекурсивно:

 kendo.ui.Grid.prototype._eraseFiltersField = function(fields, filter){
    for (var i = 0; i < filter.filters.length; i  ) {
    // For combination 'and' and 'or', kendo use nested filters so here is recursion
    if(filter.filters[i].hasOwnProperty('filters')){
        filter.filters[i] = this._eraseFiltersField(fields, filter.filters[i]);
        if($.isEmptyObject(filter.filters[i])){
            filter.filters.splice(i, 1);
            i--;
            continue;
        }
    }

    // Remove filters
    if(filter.filters[i].hasOwnProperty('field')){
        if( fields.indexOf(filter.filters[i].field) > -1){
            filter.filters.splice(i, 1);
            i--;
            continue;
        }
    }
}

if(filter.filters.length === 0){
    filter = {};
}

return filter;
}
  

Для вашей проблемы вы можете изменить метод clearFilters, чтобы принимать в качестве аргумента имя поля, которое нужно удалить из фильтра («fld_32»). Затем это поле может быть вставлено в параметр _eraseFiltersField вместо fileds сетки.

Ответ №2:

Все, что вам нужно сделать, это использовать эту функцию. Это очистит все фильтры:

 function clearFiter() {
    $("form.k-filter-menu button[type='reset']").trigger("click");
}