Custom FilterCell on some GridColumns without creating individual GridColumn

[smd]

Hi,

So, I realized that if I create a <Grid data={dataSource}></Grid>, without anything in between, it is smart enough to create all the columns for me. That is super awesome, since I have a dataset with 16 columns.

However, now that I need to customize the filterCell for a couple particular columns. How do I do that? I have two solutions

1/ It seems like if I create one GridColumn (to have filterCell attribute), I have to create all 16 of them.

2/ I can do a mapping function to create all the non-customized columns, but since the customized ones are not in sequential order, all the columns excluded from the mapping function will be placed at the end (right-most of the grid) - which is not ideal. 

Any help is greatly appreciated.

Best regards,

Luu

[Yanko]

Hello,

In this scenario, you can use the `filterCellRender` property of the Grid to render the filter cells only for the desired fields, you can acquire the default filter cells through `row.props.children.props.children[0]`, or you can provide custom ones if needed:

filterCellRender={(row, props) => {
        if (props.field == 'ProductName' || props.field == 'Discontinued')
          return (
            <div className="k-filtercell">
              {row.props.children.props.children[0]}
            </div>
          );
        else
            return <React.Fragment/>;
      }}

I prepared a StackBlitz example that shows how to apply the above approach on a Grid that has automatically defined columns:

• https://stackblitz.com/edit/react-ydyswc-vkfe8j?file=app%2Fapp.tsx 

Regards,
Yanko
Progress Telerik