Collection Component: How to Limit Search to Single Column and Word Beginnings?

Hello everyone,

I’m developing a small app cataloging all Catalan plant names found in Catalonia. The database contains 22,800 different names, which I’ve consolidated into a single table rather than separating scientific and Catalan names to stay within Glide’s 25,000-record limit for Google Sheets synchronization. You can view the app here: https://noms-de-plantes-catala.glide.page

I’ve encountered a challenge with the Collection component: it currently searches across all table columns and matches text anywhere within the cells. This results in an excessive number of irrelevant matches that cannot be effectively filtered using the In-App Filter due to the extensive list length.

The app needs to be public and available for simple consultation (without user sign-in requirements). While creating a specific search column could be a solution, it feels unnatural and would slow down the process significantly.

Is there a way to configure the Collection component to:

  1. Search within a specific column only
  2. Match text from the beginning of words rather than any position?

For example, when searching for “pi” (Catalan for “pine”), I currently get nearly 6,000 results because the letters “p” and “i” appear together in numerous cells throughout the table.

As a beginner user, I would greatly appreciate any straightforward solutions to this issue. Thank you in advance for your help.

Best regards

I think the only way to do that would be with a custom search. I shouldn’t imagine it would slow the App down. Once all rows are loaded, custom searching and filtering should be just as quick as the native options.

Darren,

How would you handle the “starts with” requirement (#2)? In a query? I don’t think you can do this with a filter in the component.

Thanks

Matt

A simple javascript snippet can do it to get a boolean value that you can use with a filter.

function partialMatch(searchString, text) {
    // Convert both strings to lowercase for case-insensitive comparison
    const lowerSearchString = searchString.toLowerCase();
    const lowerText = text.toLowerCase();
    
    // Check if text starts with the search string
    return lowerText.startsWith(lowerSearchString);
}

return partialMatch(p1, p2);
2 Likes

A custom search uses a text entry instead of the standard way using ‘show search bar’. I think these are the steps you need to take:

  1. Create a ‘user specific column’ of type Text in your Plant table (to be used as your Search-Filter text entry).
  2. Add Jeff’s javascript as a column (Experimental/Code/Javascript) with the inputs the column name you want to filter and the new search-filter column created in step one. It will resolve to true/false
  3. Create two collections (duplicate the current collection), one without a filter and the second one with the filter ( “javascript column is true”).
  4. Set visibility for collection 1 to show if ‘Search-Filter’ text is empty; set visibility for collection 2 to show if ‘Search-Filter’ is not empty.

Now when a user enters text into the ‘Search-Filter’ field Glide will hide the ‘show-all’ collection and show the “Filtered results” collection where the results match only entries that start with the filter.

It is a great technique and highlights some cool Glide features like visibility, clever filtering and User Specific Columns.

(hopefully I got this correct)

2 Likes

Thank you everyone for your fantastic help!

I’ve implemented the custom search solution in two ways - a simple version for casual users and a more detailed interface for students and researchers. It’s working great with no performance issues, just as Darren suggested.

Jeff, I look forward to testing your JavaScript solution in the future as well.

Thanks to everyone who contributed with suggestions and detailed implementation steps. Your help has been invaluable!

Best regards

1 Like

Here is a video that demonstrates my usual approach to custom filtering:

4 Likes

I wouldn’t use a query.
I’d use a Single Value column to apply the search term to all rows, then this to check for matches.

1 Like

Thank you so much, Darren!

Your video tutorial was incredibly helpful and eye-opening. I’m particularly intrigued by the top menu implementation you showed - that’s exactly the kind of navigation I’ve been trying to figure out. Until now, I’ve been using Caspio for similar projects (e.g., https://www.delphinieae.online/search/basic-search), but its maintenance costs are quite high. The “Check Text Matches” plugin you demonstrated also looks like a powerful feature.

I’ll be away traveling for the next two weeks, but I’m excited to try implementing these solutions when I return. If you don’t mind, I might reach out again if I encounter any challenges while setting it up.

Really appreciate you taking the time to create and share such detailed guidance!

Best regards

Sure. If you have follow up questions just post them here in the community. If I’m not around, then I’m sure somebody else will jump in and help.

Hi Darren,

Quick follow-up question: Is it possible to implement the “Custom Filters using Data Editor logic” in a public app without user tables and sign-in requirements? Sorry for my curiosity - I’m trying to understand if this approach could work in my current setup.

Best regards

Yes, that’s possible. You would just need to move all those User Specific columns and associated logic to the Helper table.

Thank you, Darren!

That’s fantastic news. Making those adjustments to the Helper table instead makes perfect sense for a public app. You’ve been incredibly helpful throughout this entire thread. I now have a much clearer path forward for implementing these features. Thanks again for all your expert guidance!

2 Likes

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.