Skip to content
This repository was archived by the owner on Oct 30, 2024. It is now read-only.
This repository was 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

@markgonz

Description

@markgonz

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);
        }, 
    }

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions