# In-app filter message for no matching results

**URL:** https://community.glideapps.com/t/in-app-filter-message-for-no-matching-results/74679
**Category:** Ask for Help
**Created:** [July 7, 2024, 5:59pm UTC](https://community.glideapps.com/t/in-app-filter-message-for-no-matching-results/74679 "2024-07-07T17:59:29Z")
**Posts on this page:** 10
**Page:** 1

<div class="post-metadata">

### Author: ![gannonatwork](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/gannonatwork/32/91717_2.png) [@gannonatwork](https://community.glideapps.com/u/gannonatwork)
#### Post date: [July 7, 2024, 5:59pm UTC](https://community.glideapps.com/t/in-app-filter-message-for-no-matching-results/74679/1 "2024-07-07T17:59:29Z")

</div>

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](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/4/0/401d128b7aa5bcce59b4e6d616982dd2e8d4c1c3.jpeg)

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

---

<div class="post-metadata">

### Author: ![Himaladin](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/himaladin/32/71023_2.png) [@Himaladin](https://community.glideapps.com/u/Himaladin)
#### Post date: [July 7, 2024, 7:02pm UTC](https://community.glideapps.com/t/in-app-filter-message-for-no-matching-results/74679/2 "2024-07-07T19:02:17Z")

</div>

I think for now you can only use CSS.

---

<div class="post-metadata">

### Author: ![gannonatwork](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/gannonatwork/32/91717_2.png) [@gannonatwork](https://community.glideapps.com/u/gannonatwork)
#### Post date: [July 7, 2024, 8:02pm UTC](https://community.glideapps.com/t/in-app-filter-message-for-no-matching-results/74679/3 "2024-07-07T20:02:07Z")

</div>

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?

---

<div class="post-metadata">

### Author: ![Himaladin](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/himaladin/32/71023_2.png) [@Himaladin](https://community.glideapps.com/u/Himaladin)
#### Post date: [July 7, 2024, 8:06pm UTC](https://community.glideapps.com/t/in-app-filter-message-for-no-matching-results/74679/4 "2024-07-07T20:06:43Z")

</div>

What components do you use?

---

<div class="post-metadata">

### Author: ![gannonatwork](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/gannonatwork/32/91717_2.png) [@gannonatwork](https://community.glideapps.com/u/gannonatwork)
#### Post date: [July 7, 2024, 8:44pm UTC](https://community.glideapps.com/t/in-app-filter-message-for-no-matching-results/74679/5 "2024-07-07T20:44:23Z")

</div>

It’s a collection component styled as a list.

---

<div class="post-metadata">

### Author: ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)
#### Post date: [July 7, 2024, 11:01pm UTC](https://community.glideapps.com/t/in-app-filter-message-for-no-matching-results/74679/6 "2024-07-07T23:01:33Z")

</div>

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.

---

<div class="post-metadata">

### Author: ![Himaladin](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/himaladin/32/71023_2.png) [@Himaladin](https://community.glideapps.com/u/Himaladin)
#### Post date: [July 8, 2024, 1:33am UTC](https://community.glideapps.com/t/in-app-filter-message-for-no-matching-results/74679/7 "2024-07-08T01:33:20Z")

</div>

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

```auto
#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;
}

```

---

<div class="post-metadata">

### Author: ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)
#### Post date: [July 8, 2024, 2:11am UTC](https://community.glideapps.com/t/in-app-filter-message-for-no-matching-results/74679/8 "2024-07-08T02:11:16Z")

</div>

That’s super clever.

---

<div class="post-metadata">

### Author: ![gannonatwork](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/gannonatwork/32/91717_2.png) [@gannonatwork](https://community.glideapps.com/u/gannonatwork)
#### Post date: [July 8, 2024, 9:43am UTC](https://community.glideapps.com/t/in-app-filter-message-for-no-matching-results/74679/9 "2024-07-08T09:43:23Z")

</div>

@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. 👍

---

<div class="post-metadata">

### Author: ![system](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/system/32/53398_2.png) [@system](https://community.glideapps.com/u/system)
#### Post date: [July 15, 2024, 9:43am UTC](https://community.glideapps.com/t/in-app-filter-message-for-no-matching-results/74679/10 "2024-07-15T09:43:54Z")

</div>

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