jQRangeSlider always show the last date

[irineuruiz]

I'm using jQRangeSlider, and everything works fine, except the fact that the last Date always appears in the range slider.

Follows the code generated in the browser, as you can see, appears the last date, in this case (24/07/2014) and this date are always visible in the browser :

                    var ontem = new Date();
                    var ontemValue = ontem.getTime() - 1000 * 60 * 60 * 24 * 1; // 1 dia
                    ontem.setTime(ontemValue);

                    var tresMeses = new Date();

                    var tresMesesValue = tresMeses.getTime() - 1000 * 60 * 60 * 24 * 20; // 20 dias
                    tresMeses.setTime(tresMesesValue);

                    if ($("#slider") != null) {
                        $("#slider").dateRangeSlider({
                            bounds: { min: tresMeses, max: ontem },
                            //step: { days: 1 },
                            defaultValues: { min: tresMeses, max: ontem },
                            formatter: function (val) {
                                var days = val.getDate(),
                                month = val.getMonth() + 1,
                                year = val.getFullYear();
                                if (("" + days).length == 1) days = "0" + days;
                                if (("" + month).length == 1) month = "0" + month;
                                return days + "/" + month + "/" + year;
                            }
                        });

                        $("#slider").on("valuesChanged", function (e, data) {
                            console.log("Something moved. min: " + data.values.min + " max: " + data.values.max);
                            angular.element(document.getElementById('controles')).scope().setJQRange(0, data.values.min, data.values.max); //0 -> $parent.$index
                       });
                    }

05/07/2014

24/07/2014

            <div class="ui-rangeSlider-container" style="position: absolute; width: 404px;"><div class="ui-rangeSlider-innerBar" style="position: absolute; top: 0px; left: 0px; width: 404px;"></div><div class="ui-rangeSlider-bar" style="position: absolute; top: 0px; width: 103px; left: 127.0156021118164px;"></div><div class="ui-rangeSlider-handle ui-rangeSlider-leftHandle" style="position: absolute; top: 0px; left: 126.99999989217838px;"><div class="ui-rangeSlider-handle-inner"></div></div><div class="ui-rangeSlider-handle ui-rangeSlider-rightHandle" style="position: absolute; top: 0px; left: 219.99999978923006px;"><div class="ui-rangeSlider-handle-inner"></div></div></div><div class="ui-rangeSlider-arrow ui-rangeSlider-leftArrow" style="position: absolute; left: 0px;"><div class="ui-rangeSlider-arrow-inner"></div></div><div class="ui-rangeSlider-arrow ui-rangeSlider-rightArrow" style="position: absolute; right: 0px;"><div class="ui-rangeSlider-arrow-inner"></div></div><div class="ui-rangeSlider-label ui-rangeSlider-leftLabel" style="position: absolute; display: block; right: 249px;"><div class="ui-rangeSlider-label-value">11/07/2014</div><div class="ui-rangeSlider-label-inner"></div></div><div class="ui-rangeSlider-label ui-rangeSlider-rightLabel" style="position: absolute; display: block; right: 156px;"><div class="ui-rangeSlider-label-value">16/07/2014</div><div class="ui-rangeSlider-label-inner"></div></div></div>

[ghusse]

Can you create a live example with jsfiddle? You can use this one as a starting point http://jsfiddle.net/ghusse/vM844/