Table Filter tooltip and operators table

[jocen]

Hi Retool team,

What happened to the tooltip for Filters in event handlers for controlling table? I think I've familiarised myself with the syntax of it but still good to have that tool tip there.

What I'm struggling though is probably the operators and accepted values for each. I've been scurrying over your docs and can't seem to find your filter operators table. I used to find it in this link. By struggling, I mean there's a few trial&error happening before I can move on from that particular task. Can we have that filter operators table back?

[Kabirdas]

Hey @jocen!

Thanks for surfacing this, I've brought both the tooltip and docs issue up with the team. Is there a particular way you're trying to use filters at the moment that I might be able to help with?

[jocen]

Hi @Kabirdas, thanks for replying. Not really at the moment, I was able to figure it out but that took me some time to figure out. This is for ease of life in working with filters.

[Kabirdas]

Got it, alright. We'll let you know here when the information is added!

[JadedEvan]

Just a +1 on this topic. There's not good documentation available about the table filter syntax. In a different post (Setting filter user component inputs don't change the data table) we were also linked to this now non-existent documentation.

Is it possible to get this information added to the new component library for table?

[Amanda]

Hi @JadedEvan

I am making a note about your feedback for our documentation. As you've seen our table doc relays the following info about filters:

The prior doc which has since been unlinked had a bit more information that we can bring back, but I'll post here for now:

table.setFilters(filters: FilterObject[], filterStackType?: 'and' | 'or' )
Set one or more filters with an array of filter objects.
setFilters([{ columnName: "name", filterValue: "max", operator: "contains" }])

Supported operators
"contains"
"doesNotContain"
"isEmpty"
"isNotEmpty"
"equals"
"doesNotEqual"
"greaterThan"
"lessThan"
"greaterThanOrEqual"
"lessThanOrEqual"
"before"
"after"

Passing in an empty array will reset the filters on the table:
setFilters([])

When passing multiple filters, you should set the filterStackType. FilterStackType must be either "and" or "or" (defaults to "and" if no value set):
setFilters([{ columnName: "name", filterValue: "max", operator: "contains" }, { columnName: "name", filterValue: "john", operator: "contains" }], "or")

Please, let me know if there's anything else I can provide, thanks!

[kbn]

Hey folks! Our filter operators have been added to the Build tables guide! Check this out to see detailed documentation on the methods and operator options available with the filterStack object: Display and edit data with the Table component | Retool Docs

Note - this is relevant to the new Table component released a few months ago. Thanks for your patience as we got these added to the docs

[jocen]

Thanks @kbn for the update. Exactly what was missing in the docs!

[Paulo]

For anyone using the "Legacy Table Component", the correct "Filter operator" for "doesNotEqual" is "notEquals".