MartinDK
MartinDK

Reputation: 3

Jquery MixItUp2, filtering values between 2 values

I'm trying to setup a webshop using mixitup (https://mixitup.kunkalabs.com/) for filtering/sorting of products.

This is the site as it is atm. (in danish though): http://www.boerkopcykler.dk/katalog2/74/0/Cykelcomputere_GPS

Everything is working as intended, BUT i have been asked to make a slider, to specify a price range to show.

I have searched on google on every imaginable (for me) searchstring to find out if it's possible or not.

Neither have i been able to discover anything in the docs, and im not a js novice.

I'm hoping someone has any ideas about this.

Upvotes: 0

Views: 1456

Answers (1)

George
George

Reputation: 36784

You should be able to filter your elements by their data-price attribute and then call mixItUp, passing the 'filter' parameter first, then the filtered elements:

// Here are your limits, as set by your slider or whatever..
var min = 2400, max = 3000,
    $container = $('#frmvareliste');

// Filter the mixed elements
var $show = $container.find('.mix').filter(function(){
    var price = Number($(this).attr('data-price'));
    return price >= min && price <= max
});

// Call mix it up to.. well.. mix it up..
$container.mixItUp('filter', $show);

Upvotes: 3

Related Questions