Custom kendo-grid-string-filter-menu option

[Murray]

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>

[Murray]

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>

[Martin]

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

[Murray]

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?

[Ivan]

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