# CMS Filter item counter + Static to Collection

**URL:** <https://forum.finsweet.com/t/cms-filter-item-counter-static-to-collection/1897>\
**Category:** Attributes\
**Created:** [September 11, 2023, 6:09pm UTC](https://forum.finsweet.com/t/cms-filter-item-counter-static-to-collection/1897 "2023-09-11T18:09:58Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![baldium.com](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/baldium.com/32/625_2.png) [@baldium.com](https://forum.finsweet.com/u/baldium.com)\
**Post date:** [September 11, 2023, 6:09pm UTC](https://forum.finsweet.com/t/cms-filter-item-counter-static-to-collection/1897/1 "2023-09-11T18:09:58Z")

</div>

Hello community

I’m using CMS Filter with the Results Count option. In parallel I’ve integrated successfully the Static to Collection List Attribute with Interactive option set to true.

The problem: My results counter, counts the added static element as a result. Is there any option to set the results count in CMS Filter to -1 or avoid counting the static element in the counting?

---

<div class="post-metadata">

**Author:** ![Support-Luis](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/support-luis/32/53_2.png) [@Support-Luis](https://forum.finsweet.com/u/Support-Luis)\
**Post date:** [September 11, 2023, 11:08pm UTC](https://forum.finsweet.com/t/cms-filter-item-counter-static-to-collection/1897/2 "2023-09-11T23:08:41Z")

</div>

Hey @baldium.com! Can you please share a published link? We can use the CMS Filter API to add the results count -1

---

<div class="post-metadata">

**Author:** ![baldium.com](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/baldium.com/32/625_2.png) [@baldium.com](https://forum.finsweet.com/u/baldium.com)\
**Post date:** [September 14, 2023, 4:17pm UTC](https://forum.finsweet.com/t/cms-filter-item-counter-static-to-collection/1897/3 "2023-09-14T16:17:06Z")

</div>

Hi @Support-Luis  
Of course, you can see it here: [https://www.govshare.org/massnahmen/umstellung-der-strassenbeleuchtung-auf-led](https://www.govshare.org/massnahmen/umstellung-der-strassenbeleuchtung-auf-led)

There are 2 sections where we are using this “Praxisbeispiele” and “Anbieter”

 ![Screenshot](https://europe1.discourse-cdn.com/flex013/uploads/finsweet1/original/2X/f/f1a9349754dc93deb33d86301e5c33ca9985b507.png)

---

<div class="post-metadata">

**Author:** ![Support-Luis](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/support-luis/32/53_2.png) [@Support-Luis](https://forum.finsweet.com/u/Support-Luis)\
**Post date:** [September 15, 2023, 10:27am UTC](https://forum.finsweet.com/t/cms-filter-item-counter-static-to-collection/1897/4 "2023-09-15T10:27:52Z")

</div>

hey @baldium.com! What are the numbers supposed to be? I see you are already displaying the results-1 value in the Praxisbeispiele and Anbieter counts.

---

<div class="post-metadata">

**Author:** ![baldium.com](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/baldium.com/32/625_2.png) [@baldium.com](https://forum.finsweet.com/u/baldium.com)\
**Post date:** [September 15, 2023, 10:31am UTC](https://forum.finsweet.com/t/cms-filter-item-counter-static-to-collection/1897/5 "2023-09-15T10:31:34Z")

</div>

Hi @Support-Luis

It should count the displaying items, also if you use a filter. Let me attach this screenshot to explain:

 ![Screenshot](https://europe1.discourse-cdn.com/flex013/uploads/finsweet1/original/2X/8/8b9da717d1cd4b7c2efd816c5169541f9afc0d5c.png)

---

<div class="post-metadata">

**Author:** ![Support-Luis](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/support-luis/32/53_2.png) [@Support-Luis](https://forum.finsweet.com/u/Support-Luis)\
**Post date:** [September 15, 2023, 1:14pm UTC](https://forum.finsweet.com/t/cms-filter-item-counter-static-to-collection/1897/6 "2023-09-15T13:14:35Z")

</div>

Hey @baldium.com! Can you test this code?

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

      const resultsNumberElements = document.querySelectorAll('.count-items_result'); // This is the class for all your result count text elements

      // Define a function to update the resultsNumber element
      function updateResultsNumber(filterInstance, resultsNumberElements, index) {
        let filterResult = filterInstance.resultsElement;

        // Check if the index is within the bounds of resultsNumberElements
        if (index < resultsNumberElements.length) {
          let resultsNumber = resultsNumberElements[index];

          // Get the current innerHTML of filterResult as a number
          let currentNumber = parseInt(filterResult.innerHTML, 10);

          // Subtract 1 from the number if it's greater than 0
          if (currentNumber > 0) {
            currentNumber -= 1;
          } else {
            // If it's 0 or negative, set it to 0
            currentNumber = 0;
          }

          // Set the updated value as the innerHTML of resultsNumber
          resultsNumber.innerHTML = currentNumber.toString();
        }
      }

      // Now, you can call the function in your code
      filterInstances.forEach((filterInstance, index) => {
        updateResultsNumber(filterInstance, resultsNumberElements, index);
      });

      filterInstances.forEach((filterInstance, index) => {
        filterInstance.listInstance.on('renderitems', (renderedItems) => {
          updateResultsNumber(filterInstance, resultsNumberElements, index);
        });
      });
    },
  ]);
</script>

```

There might be some fine tuning as I see the static element is removed on filtering but let me know how it works and I can fix it for you

---

<div class="post-metadata">

**Author:** ![baldium.com](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/baldium.com/32/625_2.png) [@baldium.com](https://forum.finsweet.com/u/baldium.com)\
**Post date:** [September 15, 2023, 2:59pm UTC](https://forum.finsweet.com/t/cms-filter-item-counter-static-to-collection/1897/7 "2023-09-15T14:59:57Z")

</div>

> [@Support-Luis](#):
>
> ing as I see the static element is removed on filtering but let me know how it works and I can fix it

Hi @Support-Luis

Thanks for your quick reply. I’ve tested it, but it still counts the static item.

---

<div class="post-metadata">

**Author:** ![Support-Luis](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/support-luis/32/53_2.png) [@Support-Luis](https://forum.finsweet.com/u/Support-Luis)\
**Post date:** [September 15, 2023, 4:24pm UTC](https://forum.finsweet.com/t/cms-filter-item-counter-static-to-collection/1897/8 "2023-09-15T16:24:51Z")

</div>

sorry, I forgot to add that you need to add an element as a sibling to the item counters with the class `count-items_result`

---

<div class="post-metadata">

**Author:** ![baldium.com](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/baldium.com/32/625_2.png) [@baldium.com](https://forum.finsweet.com/u/baldium.com)\
**Post date:** [September 15, 2023, 9:54pm UTC](https://forum.finsweet.com/t/cms-filter-item-counter-static-to-collection/1897/9 "2023-09-15T21:54:07Z")

</div>

> [@Support-Luis](#):
>
> count-items\_result

Hi @Support-Luis

It works when not using the filters. I left in production so you can check it:

 ![Screenshot](https://europe1.discourse-cdn.com/flex013/uploads/finsweet1/original/2X/2/26a7aa2a6919085d49f22ff964d2abcda81030f7.png)

---

<div class="post-metadata">

**Author:** ![Support-Luis](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/support-luis/32/53_2.png) [@Support-Luis](https://forum.finsweet.com/u/Support-Luis)\
**Post date:** [September 18, 2023, 9:27am UTC](https://forum.finsweet.com/t/cms-filter-item-counter-static-to-collection/1897/10 "2023-09-18T09:27:53Z")

</div>

Hey @baldium.com! I’ve added a check to see if there are any active filters, if there are, the result will be the same without having to subtract the Static Item value. Can you please test this?

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

      const resultsNumberElements = document.querySelectorAll('.count-items_result'); // This is the class for all your result count text elements

      // Define a function to update the resultsNumber element
      function updateResultsNumber(filterInstance, resultsNumberElements, index) {
        let filterResult = filterInstance.resultsElement;

        // Check if the index is within the bounds of resultsNumberElements
        if (index < resultsNumberElements.length) {
          let resultsNumber = resultsNumberElements[index];

          // Get the current innerHTML of filterResult as a number
          let currentNumber = parseInt(filterResult.innerHTML, 10);

          // Check if filters are active
          if (!filterInstance.filtersActive) {
            // Subtract 1 from the number if it's greater than 0
            if (currentNumber > 0) {
              currentNumber -= 1;
            } else {
              currentNumber = 0;
            }
          }

          // Set the updated value as the innerHTML of resultsNumber
          resultsNumber.innerHTML = currentNumber.toString();
        }
      }

      filterInstances.forEach((filterInstance, index) => {
        updateResultsNumber(filterInstance, resultsNumberElements, index);
      });

      filterInstances.forEach((filterInstance, index) => {
        filterInstance.listInstance.on('renderitems', (renderedItems) => {
          updateResultsNumber(filterInstance, resultsNumberElements, index);
        });
      });
    },
  ]);
</script>

```

---

<div class="post-metadata">

**Author:** ![baldium.com](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/baldium.com/32/625_2.png) [@baldium.com](https://forum.finsweet.com/u/baldium.com)\
**Post date:** [September 18, 2023, 2:34pm UTC](https://forum.finsweet.com/t/cms-filter-item-counter-static-to-collection/1897/11 "2023-09-18T14:34:11Z")

</div>

Right now it shows the correct amount, but once I use the filter, the static item disappears (I could live with that, although it’s not optimal) and the result is not correct, it shows 2, when 3 are showing.

---

<div class="post-metadata">

**Author:** ![Support-Luis](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/support-luis/32/53_2.png) [@Support-Luis](https://forum.finsweet.com/u/Support-Luis)\
**Post date:** [September 18, 2023, 3:25pm UTC](https://forum.finsweet.com/t/cms-filter-item-counter-static-to-collection/1897/12 "2023-09-18T15:25:06Z")

</div>

Try this, I added a timeout before running the function when filters are applied you can increase the time if needed.

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

      const resultsNumberElements = document.querySelectorAll('.count-items_result'); // This is the class for all your result count text elements

      // Define a function to update the resultsNumber element
      function updateResultsNumber(filterInstance, resultsNumberElements, index) {
        let filterResult = filterInstance.resultsElement;

        // Check if the index is within the bounds of resultsNumberElements
        if (index < resultsNumberElements.length) {
          let resultsNumber = resultsNumberElements[index];

          // Get the current innerHTML of filterResult as a number
          let currentNumber = parseInt(filterResult.innerHTML, 10);

          // Check if filters are active
          if (!filterInstance.filtersActive) {
            // Subtract 1 from the number if it's greater than 0
            if (currentNumber > 0) {
              currentNumber -= 1;
            } else {
              currentNumber = 0;
            }
          }

          // Set the updated value as the innerHTML of resultsNumber
          resultsNumber.innerHTML = currentNumber.toString();
        }
      }

      filterInstances.forEach((filterInstance, index) => {
        updateResultsNumber(filterInstance, resultsNumberElements, index);
      });

      filterInstances.forEach((filterInstance, index) => {
        filterInstance.listInstance.on('renderitems', (renderedItems) => {
          setTimeout(() => {
            updateResultsNumber(filterInstance, resultsNumberElements, index);
          }, 200);
        });
      });
    },
  ]);
</script>

```

---

<div class="post-metadata">

**Author:** ![baldium.com](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/baldium.com/32/625_2.png) [@baldium.com](https://forum.finsweet.com/u/baldium.com)\
**Post date:** [September 19, 2023, 7:38am UTC](https://forum.finsweet.com/t/cms-filter-item-counter-static-to-collection/1897/13 "2023-09-19T07:38:40Z")

</div>

> [@Support-Luis](#):
>
> sorry, I forgot to add that you need to add an element as a sibling to the item counters with the class `count-items_result`

@Support-Luis It worked! 🤩 Thank you so much!

Although I have 2 counters on that site and the second one was showing cero. I’ve duplicated script and classes and managed to make it work for both.

---

<div class="post-metadata">

**Author:** ![Support-Luis](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/support-luis/32/53_2.png) [@Support-Luis](https://forum.finsweet.com/u/Support-Luis)\
**Post date:** [September 19, 2023, 9:04am UTC](https://forum.finsweet.com/t/cms-filter-item-counter-static-to-collection/1897/14 "2023-09-19T09:04:17Z")

</div>

@baldium.com you are welcome!

The script should have handled both lists item counters, but anyway great to hear you got it to work!