jQuerty UI range slider bug after change min value - jquery-ui

Question

I have one slider in my page, with this code
<div id="sale-price-range" class="price-range" data-min="200000" data-max="2000000" data-unit="R$" data-min-field="precoMinVenda" data-max-field="precoMaxVenda" data-increment="100000"></div>
My js code is:
// Price Range
$(".price-range").each(function() {
var dataMin = $(this).attr('data-min');
var dataMax = $(this).attr('data-max');
var dataUnit = $(this).attr('data-unit');
var minField = $(this).attr('data-min-field');
var maxField = $(this).attr('data-max-field');
var increment = $(this).attr('data-increment');
$(this).append( "<input type='text' class='first-slider-value' name='"+minField+"' val=''/><input type='text' class='second-slider-value' name='"+maxField+"'/>" );
$(this).slider({
range: true,
min: 0,
max: dataMax,
step: increment,
values: [ dataMin, dataMax ],
slide: function( event, ui ) {
event = event;
if(ui.value < dataMin) {
return false;
}
$(this).find( ".first-slider-value" ).val( dataUnit + " " + ui.values[ 0 ].toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1.") );
$(this).find( ".second-slider-value" ).val( dataUnit + " " + ui.values[ 1 ].toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1.") );
},
stop: function(event,ui) {
if(ui.value >= dataMin) {
postAjaxSearch();
}
}
});
$(this).find( ".first-slider-value" ).val( dataUnit + " " + $( this ).slider( "values", 0 ).toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1.") );
$(this).find( ".second-slider-value" ).val( dataUnit + " " + $( this ).slider( "values", 1 ).toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1.") );
});
It works very well, but if I try to change
min: 0,
To
min: dataMin,
My slider stop to work (I can't drag it). It continues to call postAjaxSearch();, but it doesn't change max/min value neither move the slider-handle.
Why do I need to change min to dataMin?
Because my slider start from 0, but the slider-handle move from dataMin from dataMax. The range betweem dataMin and 0 is on page, but can't move there. I don't want this, the slider should start from dataMin.
Work, but with this space on left (min: 0)
No space, but doesn't work (min: dataMin)

Answer 1

I had the same exact problem, I solved it by using parseInt() on the min value
$("#price-slider").slider({
range: true,
min: parseInt(price_min),
max: price_max,
values: [price_min, price_max],
slide: function (event, ui) {
$("#amount").val("$" + ui.values[0] + " - $" + ui.values[1]);
}
});
I have no idea why this works, it would seem logical that both extremes would work the same but apparently they don't.