NoUISlider Tooltip only show integers

This can work..

var sliderFormat = document.getElementById('slider-format');

noUiSlider.create(sliderFormat, {
start: [ 20 ],
...
format: {
    from: function(value) {
            return parseInt(value);
        },
    to: function(value) {
            return parseInt(value);
        }
    }
});

I you don't want to use wNumb - library , this method might work. This will give you value without decimals. Hope this helps.

value.split('.')[0]

If you don't think you'll ever need to have decimal places on your site, you can search the jquery.nouislider.min.js file for toFixed(2) and replace with toFixed(0).


You can either try using the unencoded value like described in noUISlider's documentation about events and their binding

slider.noUiSlider.on("update", function(values, handle, unencoded ) {
    // values: Current slider values;
    // handle: Handle that caused the event;
    // unencoded: Slider values without formatting;
});

or another possibility would be using the format option on slider creation (but haven't tried it myself yet):

noUiSlider.create(slider, {
    start: [ 20000 ],
    ...
    format: wNumb({
        decimals: 0, // default is 2
        thousand: '.', // thousand delimiter
        postfix: ' (US $)', // gets appended after the number
    })
});

The drawback is you have to download the wNumb-Library separately from here: http://refreshless.com/wnumb/.


Another way without wNumb

After having another look at the examples from noUISlider, I found this way for manually formatting (at the bottom of the page):

var sliderFormat = document.getElementById('slider-format');

noUiSlider.create(sliderFormat, {
    start: [ 20 ],
    ...

    format: {
      to: function ( value ) {
        return value + ',-';
      },
      from: function ( value ) {
        return value.replace(',-', '');
      }
    }
});