Можете ли вы сделать один фильтр с несколькими полями в Kendo UI? - PullRequest
0 голосов
/ 24 июня 2019

У меня есть таблица, заполненная элементами, которые содержат несколько различных полей, и я создал панель поиска, которую собираюсь использовать для поиска в таблице элементов с полями, которые соответствуют искомому термину. Это просто собирается применить фильтр к сетке с заданным термином. У меня получается, что я могу что-то набирать и искать по названию, но я хочу расширить это и иметь возможность искать любые поля в сетке.

Например, объект foo может иметь поля Title, Description, ID и Display Name. Я могу создать подобный фильтр для явного поиска в таблице совпадений в поле Title:

let newFilter = { field: "Title", operator: "contains", value: term };

, где term - переменная, представляющая пользовательский ввод. И вот здесь я немного запутался в отношении того, что делать дальше: могу ли я каким-то образом создать один фильтр, который вместо использования жестко закодированного «Заголовка» в качестве поля ищет в любом из полей foo соответствующий термин? Или мне нужно было бы создать 4 разных фильтра, по одному для каждого поля, а затем поставить на них знак 'или', указывающий сетку, чтобы показать результаты с термином из какого-либо из полей? Имеет ли это смысл?

1 Ответ

1 голос
/ 24 июня 2019

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

Например:

Current sample record: {"Title":"MR", "Description":"Hello", "ID":"1234", "DisplayName":"TestDisplay"}

After adding one new field with all the values: {"Title":"MR", "Description":"Hello", "ID":"1234", "DisplayName":"TestDisplay", "AllTheValues":"MR Hello 1234 TestDisplay"}

Отобразить это новое поле в фильтре:

let newFilter = { field: "AllTheValues", operator: "contains", value: term };

Для отображения цели вы можете использовать Шаблон столбца Kendo Grid , чтобы отобразить любое желаемое значение в столбце сетки.

Пример: { field: "AllTheValues", template: "<strong>#: Title# </strong>" }

...