Skip to content
This repository has been archived by the owner on Oct 30, 2024. It is now read-only.

How can I prevent two Mixitup3 Multifilter instances from controlling one another? #620

Open
markgonz opened this issue Mar 25, 2024 · 0 comments

Comments

@markgonz
Copy link

markgonz commented Mar 25, 2024

I created a block for wordpress that uses mixitup to display filterable posts. The block can be used more than once on a page. The issue I am having is that the filter controls from one instance controls all instances. Below is my mixitup initialization code. As you can see the instances are unique. Before adding mutifilter I was able to tell each instance where its controls were with /control: '#<?php echo $id; ?> .<?php echo $filter; ?>', but it seems this does not work with multifilter. Any help would be greatly appreciated.

$filter = 'filter_' . $block['id'];
$partnerItem = 'partnerItem_' . $block['id'];
$partnerpageList = 'pageList_' . $block['id'];
$partnerpageStats = 'pageStats_' . $block['id'];


// Initialize MixItUp
        var mixer_<?php echo $id; ?> = mixitup('#<?php echo $partnerlist; ?>', {
            selectors: {
               //control: '#<?php echo $id; ?> .<?php echo $filter; ?>',
                target: '.<?php echo $partnerItem; ?>',
                pageList: '.<?php echo $partnerpageList; ?>',
                pageStats: '.<?php echo $partnerpageStats; ?>',
            },
            multifilter: {
            enable: true
            },
            animation: {
                duration: 300
            },
            pagination: {
                limit: 12, 

            },
        callbacks: {
        onMixStart: function(state, futureState) {
            console.log('%cActive filter: ','background:red; color:white;',futureState.activeFilter.selector);
            console.log('%cContainer: ','background:white; color:red;',futureState.container);
        }, 
    }
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant