> For the complete documentation index, see [llms.txt](https://docs.airdev.co/canvas-pages-and-modules/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.airdev.co/canvas-pages-and-modules/master-1/modules/single-input-search-bar-and-filter-group.md).

# Single Input Search Bar and Filter Group

## Overview

This is a fully-responsive module that includes a search bar with an input and a reusable called [`applyfilters`](https://docs.airdev.co/canvas-pages-and-modules/modules/applyfilters) for applying filters. No workflows are associated with this module.&#x20;

![](/files/-LgUGmRscb5K-6pLF1Ku)

## Structure

* When this module is added to a page, it is placed within a group called `Group page860Group` on the page. This group contains the responsive settings for all modules.
* This module `Group singleSearchFilter` contains three main groups:
  * `Group responsive` - For responsiveness (please do not delete). This group will hide and collapse when the current page width is less than or equal to 500
  * `Group reponsive2` - For responsiveness (please do not delete). This is an optional padding group below the search bar. Hide if not needed.
  * `Group search bar` - This group contains an input, clear input button, and filter options.
* All data is displayed in `RepeatingGroup 780-TextFormattedExpandableGroup`

## How to set up

* Add the following workflow to the page (this removes the filter's circular background hover effect):
  * *When page is loaded, set state of applyfilters's Remove background hover? to yes*

![](/files/-LgUN7zOmOLcnlDdHjAH)

* Modify the filter options in the reusable element for `applyfilters`. [`Click here`](https://docs.airdev.co/canvas-pages-and-modules/modules/applyfilters) for more information.
* Add a search constraint to your repeating group on the page
  * Refer to `Input Search for something`
* Uncheck the box for *This element is visible on page load* for `Group responsive2` if you do not need the extra padding beneath the search bar

![](/files/-LgUMQOt_0_nVW0Gnvr5)
