"format" option breaks the slider completely

Here’s the reduced case. If you remove the format : { … } section, everything works (well, except the custom formatting). It looks like your code sends NaN as parameters to the from() and to() methods.

<link href="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/9.0.0/nouislider.min.css" rel="stylesheet" type="text/css">
<div id="range"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/9.0.0/nouislider.min.js" type="text/javascript"></script>
<script>
	var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
	slider = document.getElementById('range');
	slider.style.width = "50%";
	slider.style.margin = "50px";
	var date_range = {min: 1468951379, max: 1477116021};
	var options = {
		start: [date_range.min, date_range.max],
		connect: true,
		range: date_range,
		format: {
			to: function(v){
				var a = new Date(v * 1000);
				return months[a.getMonth()] + " " + a.getDate();
			},
			from: function(v) {
				var a = new Date(v * 1000);
				return months[a.getMonth()] + " " + a.getDate();
			}
		},
		tooltips: true
	};
	noUiSlider.create(slider, options);
</script>
`

[i-fail]

leongersen, your comment made me test a few things. Turns out from() method actually gets a number, not a string - you can console.log it, if you don’t believe me.

So this change made everything work:

        format: {
            to: function(v){                
                var a = new Date(v * 1000);
                return months[a.getMonth()] + " " + a.getDate();
            },
            from: function(v) {
                return v;
            }
        },

[github-actions[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.