Finsweet filter not working with select2 package

I had a CMS collection list. i added all the steps to make a select filter and it was working fine.
But I wanted a searchable dropdown filter like shown below. so i made the same select dropdown to be a select2, which gives feasibility for searchable dropdown as mentioned in the basic usage of the select2 documentation .
After adding this code in body tag, the finsweet filter functionality is not working
finsweet filter link: CMS Filter for Webflow - No-code using Attributes
select2 documentation link: Basic usage | Select2 - The jQuery replacement for select boxes
body code:

<script async src=""></script>
<link href="" rel="stylesheet" />
<script src=""></script>
$(document).ready(function() {


jQuery’s select2 is preventing the input events from bubbling. this causes cmsfilter to not catch them. after updating the code for select2 it is working

$(document).ready(function() {
                var $eventSelect = $("#designation")
                $eventSelect.on("select2:select", function(e) {
                    $eventSelect[0].dispatchEvent(new Event('input', { bubbles: true }));

source: finsweet CMS Filter not working along with select2 · Issue #58 · finsweet/fs-snippets · GitHub

1 Like

Thanks for sharing, that’s so helpful for me!