Search code examples
jqueryjslider

Jslider execute code on change


I am using a theme with Jslider this (bottom right corner).

I want the jslider.change to hide all the divs with data-price outside the range.

For this I have constructed this function:

function filterSystem(minPrice, maxPrice) {
$("#carlist div.row-item").hide().filter(function() {
var price = parseInt($(this).data("price"), 10);
return price >= minPrice && price <= maxPrice;
}).show();
}

With the normal Jquery range slider i can trigger that via the slide: function(event, ui) command. How can i trigger it via jslider ?

In Jquery range slider i would use

            slide: function(event, ui) {
                $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
                 var mi = ui.values[ 0 ];
                var mx = ui.values[ 1 ];
                filterSystem(mi, mx);
           }

Kind thanks!


Solution

  • Try this:

    $(".selector").slider({
        onstatechange: function( value ){
            console.dir( value );
        }
    });