Search bar for firestore

HI I've been looking on the internet on how to filter data using a search bar with my firestore database however all I can see is solutions for postgres and sql but none for firestore. Does anyone knows how to filter data using a search bar in firestore? would be a huge help. Thanks!

Hey @Nur_Azril_Onkassim! Hmm, the easiest way I can think of is to use a Query JSON with SQL query type: https://docs.retool.com/docs/querying-via-sql

One thing to note! Firestore queries return their .data as an array of objects (perfect for the Query JSON with SQL query type). Others (like Postgres) return an object of arrays, so we need to use the formatDataAsArray method to transform the data into an array of objects instead.

Let me know if you have any questions about this special query type—I'd be happy to help get you setup.

Here's the SQL I'm using (in a Query JSON with SQL query type where query1.data is my Firestore query):

select * from {{query1.data}} 
where ({{!textInput1.value}} or deal_name like {{'%' + textInput1.value + '%'}} or email like {{'%' + textInput1.value + '%'}})

And in the table component, I'm using the Query JSON with SQL query as the data source!

I also wonder if the Firebase raw query type (in beta) might be helpful? https://docs.retool.com/docs/firebase-raw-queries-beta#query-a-collection-selected-in-select1-component

Let me know if you're interested!

Hi! sorry for the late reply, I followed your instructions and it worked... well I mean the query run successfully however when I input some letters or words the table doesn't update on change per input. I've tried setting the text input's event handler to the SQL query and set it on change but the table doesn't also update whenever I give an input. I've also tried setting the success event handler and it just infinitely queries without updating the table.

You shouldn’t need to add any event handlers actually! Your Query JSON with SQL query just needs to be set to run automatically when inputs change and your table needs to be using the Query JSON with SQL query as its data source.

Thank you so much! I replaced the query of the input field to the Query JSON with SQL and it worked! This is a really huge help, thanks retool team!

1 Like

So glad to hear it :blush:

1 Like