Nouislider setting range from variable

Question

I'm using the nouislider (https://refreshless.com/nouislider/) and I want to set up the range values from variables. But the slider won't create if I use the variables values.

jQuery.each(sliders, function (key, slider) {
    var id = $(this).attr("data-id");
    var from = $(this).find("input[data-type='from']").val();
    var to = $(this).find("input[data-type='to']").val();
    var min = $(this).find("input[data-type='min']").val();
    if(min < 0) {
        min = 0;
    }

    var max = $(this).find("input[data-type='max']").val();
    if(min == max) {
        max += 1;
    }
    noUiSlider.create(slider.getElementsByClassName("attrfilterslider")[0], {
        start: [from, to],
        connect: true,
        range: {
            'min': from,
            'max': to
        },
        animate: true,
    });
});

The start points work fine, the range is much worse. When I set up the constants as range points everything works fine. But Its not workign with variables. I tried to change variables, retype etc. but its still not working. Any ideas how to fix it?

FutureMode FutureMode · Accepted Answer · 2017-12-11T12:39:52

Hey i think noUIslider expect numbers not a string. Try to parseInt() the variables and it should work.

Here you can read it - https://refreshless.com/nouislider/slider-options/

Nouislider setting range from variable

1 Answers