[ANSWERED] Can we defined our own custom filter function on a column?

Our pure JavaScript Scheduler component


Post Reply
User avatar
peterjc
Premium Member
Premium Member
Posts: 81
Joined: Wed Sep 11, 2019 8:18 am

[ANSWERED] Can we defined our own custom filter function on a column?

Post by peterjc »

Hi, I am using the Scheduler in my Ionic?Angular projects, and I have just a single column I define as follows..

Code: Select all

public columns = [
    {
      type: 'resourceInfo',
      field: 'name',
      showImage: false,
      editor: false,
      showEventCount: false,
      searchable: false,
      sortable: false,      
renderer({ cellElement, record }) {
const colour = record.data.colour; if (colour) { ... } return record.name; }, headerRenderer(data) { return "<div style='padding:0;margin:0'></div>"; } } ];

And this gives me the filter box above my column..

filter.png
filter.png (10.02 KiB) Viewed 28 times

This filters my resources using a "contains", but I was wondering is there a way to defined a custom filter function, if I were to want to perhaps let a user put in a more complex filter term, and then I could use the function to parse it, where function would need to have access to the filter text entered, and then be able to compare this to each resource and return a pass or fail?

Thanks in advance for any help.


User avatar
pmiklashevich
Core Developer
Core Developer
Posts: 2725
Joined: Fri Apr 01, 2016 11:08 am

Re: Can we defined our own custom filter function on a column?

Post by pmiklashevich »

That's supported! Please see https://www.bryntum.com/docs/scheduler/#Grid/feature/FilterBar docs.
filterable could be a function or a config with filterFn specified:

Code: Select all

  columns: [
     {
       field      : 'age',
       text       : 'Age',
       type       : 'number',
       // Custom filtering function that checks "greater than"
       filterable : ({ record, value }) => record.age > value
     },

Code: Select all

  columns: [
     {
       field : 'name',
       // Filterable may specify a filterFn and a config for the filtering input field
       filterable : {
         filterFn : ({ record, value }) => record.name.toLowerCase().indexof(value.toLowerCase()) !== -1,
         filterField : {
           emptyText : 'Filter name'
         }
       }
     },
Pavel Miklashevich - Core Developer

User avatar
peterjc
Premium Member
Premium Member
Posts: 81
Joined: Wed Sep 11, 2019 8:18 am

Re: Can we defined our own custom filter function on a column?

Post by peterjc »

Hi pmiklashevich,

I did miss finding that in the doco, but there it is.

Thank you very much that does exactly what I was after!

Post Reply