In-app filter message for no matching results

Ask for Help
1

Is there a way to display a message to users when using a native in-app filter and the user’s filter choices/configuration doesn’t produce a result?

in-app-msg
in-app-msg772×690 41.2 KB

I don’t see any way to do this — there’s nothing to ITE or query or similar. Am I missing something simple? Thx

2

I think for now you can only use CSS.

3

I appreciate the feedback. I’m curious how I would solve this using css since there isn’t anything to target with a new style is there?

4

What components do you use?

5

It’s a collection component styled as a list.

6

I’m not sure if that’s even possible because you don’t have access to the in-app filter values as a developer, so maybe there’s not a way to get access to the number of filtered records on the screen. As I understand, you have to get that to be able to show something when the user gets to that state, but I might be wrong.

7

@gannonatwork, next to the collection component (class name: collectionName), you need to add a text/rich text component and name its class emptyMsg.

#page-root:has(.collectionName > div > .component-root > div > div > div:nth-child(2)) [data-testid="wire-container-emptyMsg"]{
display:none;
}

/*This second code can be removed because the component is essentially visible.*/
#page-root:not(:has(.collectionName > div > .component-root > div > div > div:nth-child(2))) [data-testid="wire-container-emptyMsg"]{
display:block;
}
8

That’s super clever.

9

@Himaladin, this is awesome! Thank you for taking the time to come up with this css, it is much appreciated. Until Glide provides a native solution, this is a sweet workaround. Thx again. :+1: