Add empty option to select component to filter

App Building
1

hi, how i can add in my select component a option but EMPTY not null, as in my db i got fields with empty values like this

image
image449×583 38.8 KB

i would like to add option to add empty in select so i can filter and see how much i got empty on my table.

thank you

2

Are you using the table built-in filter option or does the select re-run the query?
Can you coerce the empty/null values in that column to be NULL in the query so the filtering is consistent?
How are the values in the drop down generated now? Do you hard code the list or pull the unique values of Acreedor from the displayed data/source table?

1 Like
3

I hard code options as i dont want more load loading that from db, but yes i have a db with that options too

4

How to coerce?

5

That will depend on your database, in Postgres for example you could use NULLIF(field, '')
Are you wanting to select a value in the drop down to re-run the query or you're wanting to filter the data in the table? ie a where clause in your query, or a javascript transformation/filter in the app?

1 Like
6

i got this as a filter and in my query i got this:

  AND (
    {{acreedor.value.length === 0}}
    OR c.acreedor = ANY ({{ acreedor.value }})
  )
7

So the first step will be to add in the where clause that you're wanting to apply and then add in the "if they selected 'Empty' from the dropdown"
As you're hardcoding the list then it should be easy enough to add that option with a value of "isempty" or "isnotempty"
Your query might be something like:

{{ acreedor.value.includes('isnotempty') }} AND c.acreedor is not null

or

{{ acreedor.value.includes('isempty') }} AND c.acreedor is null

If you've got some empty strings (not null) then you could coerce it into a null as mentioned before or you could add in a not null AND <> '' clause

1 Like
8

but, right now my acreedor filter its a multi select component, i got this in my query

  AND (
    {{acreedor.value.length === 0}}
    OR c.acreedor = ANY ({{ acreedor.value }})
  )

this doesnt changes what you said?