This is a migrated thread and some comments may be shown as answers.

Custom kendo-grid-string-filter-menu option

4 Answers 13 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Murray
Top achievements
Rank 1
Veteran
Murray asked on 18 Feb 2021, 11:35 AM

Hi there,

I need to be able to use the kendo-grid-string-filter-menu but the available kendo directives to use inside this do not cover my specific use case. I need to have an 'Is blank' filter and an 'Is Null' filter. Is it possible to write my own such that I can add it in the below. If so, how would it look?

 

  <kendo-grid-string-filter-menu
        [column]="column"
        [extra]="true"
        [filter]="filter"
        [filterService]="filterService">

        <kendo-filter-contains-operator>
        </kendo-filter-contains-operator>
        <kendo-filter-eq-operator>
        </kendo-filter-eq-operator>
        <kendo-filter-neq-operator>
        </kendo-filter-neq-operator>

      </kendo-grid-string-filter-menu>

4 Answers, 1 is accepted

Sort by
0
Murray
Top achievements
Rank 1
Veteran
answered on 18 Feb 2021, 11:37 AM

ie something like this:

 

  <kendo-grid-string-filter-menu
        [column]="column"
        [extra]="true"
        [filter]="filter"
        [filterService]="filterService">

    <custom-filter-is-null-operator>

</custom-filter-is-null-operator>

<custom-filter-is-blank-operator>

</custom-filter-is-blank-operator>
        <kendo-filter-contains-operator>
        </kendo-filter-contains-operator>
        <kendo-filter-eq-operator>
        </kendo-filter-eq-operator>
        <kendo-filter-neq-operator>
        </kendo-filter-neq-operator>
      </kendo-grid-string-filter-menu>

0
Martin
Telerik team
answered on 22 Feb 2021, 08:00 AM

Hello Murray,

The kendo-grid-string-filter-menu component supports a built-in 'Is null' filter operator:

https://www.telerik.com/kendo-angular-ui/components/grid/api/IsNullFilterOperatorComponent/

 

<kendo-grid-string-filter-menu
            [column]="column"
            [extra]="true"
            [filter]="filter"
            [filterService]="filterService"
          >
            <kendo-filter-contains-operator> </kendo-filter-contains-operator>
            <kendo-filter-eq-operator> </kendo-filter-eq-operator>
            <kendo-filter-neq-operator> </kendo-filter-neq-operator>
            <kendo-filter-isnull-operator> </kendo-filter-isnull-operator>
          </kendo-grid-string-filter-menu>

 

Regarding the blank operator (Is blank), please check the built-in Is empty filter operator:

https://www.telerik.com/kendo-angular-ui/components/grid/api/IsEmptyFilterOperatorComponent/

In case this operator does not satisfy your needs, I am afraid that the developer needs to create an entirely custom filter menu by utilizing the kendoGridFilterMenuTemplate. The template allows adding any custom code (or component) as a filter in the Grid, as well as custom dropdown with the desired operators. For more information and examples refer to the following documentation article:

https://www.telerik.com/kendo-angular-ui/components/grid/filtering/reusable-filter/#toc-filter-menu-with-popup

At the moment the kendo-grid-string-filter-menu does not support custom components as its requests. Using the aforementioned template is the only option up to now, to customize the operators list with items that are not supported.

I hope this helps. Let me know if I am missing something. 

Regards,
Martin
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

0
Murray
Top achievements
Rank 1
Veteran
answered on 01 Mar 2021, 05:28 PM

I've tried adding both these operators to my list as you illustrated above, but they don't show up in my operators dropdown. Code compiles... What could be the problem?

0
Ivan
Telerik team
answered on 03 Mar 2021, 02:08 PM

Hi Murray,

We will need some code samples in order to suggest a solution, so you can send us some striped project that demonstrates the problem , or ideally runnable stackblitz sample. Like this one, which demonstrates having only isNull and isEmpty operators for first column.

Looking forward to hear from you, in order to get it working at your site.

Regards,
Ivan
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
Grid
Asked by
Murray
Top achievements
Rank 1
Veteran
Answers by
Murray
Top achievements
Rank 1
Veteran
Martin
Telerik team
Ivan
Telerik team
Share this question
or