Query stays in search field after returning with browser

General
1

Hey guys!

I’m using the filter attribute with a search bar.

Screenshot0
Screenshot01842×922 82.3 KB

When searching for a query and entering one of the cms items and than using the return function of the browser the search field maintains the query visible, although the filter is not active anymore.

Screenshot
Screenshot1762×1034 106 KB

Is there any option to clear the search field or even better maintain the filter active?

2

Hey @baldium.com! You can dispatch an input event once CMS Filter loads if there is any text then the list will filter if the field is empty then the list will stay the same.

Here is the code to add to your </body> section of this page

<script>
  window.fsAttributes = window.fsAttributes || [];
  window.fsAttributes.push([
    'cmsfilter',
    (filterInstances) => {
      console.log('cmsfilter Successfully loaded!');

      document
        .querySelector('.YOUR-SEARCH-BAR-CLASS')
        .dispatchEvent(new Event('input', { bubbles: true }));
    },
  ]);
</script>

You cab use your preferred selector :wink:

3

Awesome! Thank you so much!

1 Like