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