Add Exposed filters in Views in Drupal 9
In order to proceed you should have:
- Drupal installed
- virtual host ready for you
- xampp setup or other web server
- composer installed
- drush installed
- views created
#STEP 1: Exclude current page from results
In previous tutorial we have added an exposed block to all article pages. This block shows the latest 4 items added to the system. We want to exclude the current page from the list in order to avoid doubling of content.
Navigate to Block view and find the CONTEXTUAL FILTERS section. Click on “Add” button.
Search for id and find the ID title in Content Category. Make sure that we are doing this only for “This block (override)”
Set a default value for the ID — Content ID from URL
In order to exclude the item from the view we need to click on “MORE” section and then next to “Exclude” checkbox.
Then save the option and save the view.
Issue is fixed.
#STEP 2: Install Better Exposed Filters
https://www.drupal.org/project/better_exposed_filters
composer require drupal/better_exposed_filters
Once this is done, go to admin panel. Extend and find “Better Exposed Filters” module.
Install the module.
We need to install the library manually.
jQuery UI Touch Punch requires the jquery.ui.touch-punch.min.js library. Download it (https://github.com/furf/jquery-ui-touch-punch) and place it in the libraries folder (/libraries)
Create the libraries folder if you are missing it. Download the file and place it in it.
#STEP 3: Alter page view and add expose filters
Navigate to the view page edit.
Click on “Add” button next to FILTER CRITERIA
Search for title
Then on the next screen expose the filter.
We are marking the Operator to be “Contains all words”.
Add second filter related to Authored on.
Save the view.
If we try to access the view now we have two filters and we could play with them. Sadly the date one is not really UX friendly.
#STEP 4: Better UX for exposed filters
Install https://www.drupal.org/project/date_popup
composer require drupal/date_popup
Install the module
Clear cache
drush cr
Our filters are done. We could search based on title and select dates.
