user2737457
user2737457

Reputation: 293

JQuery Numeral Slider Error

I'm using a JQuery slider to allow site members to edit a search radius and automatically input the value into a hidden field. The code I'm using works well but it displays too many numbers after the . in the input field. I've created a Fiddle to better display this. Does anyone know how to prevent the large amount of numbers in the input field?

Here is my code & JSFiddle:

<div class="sectionInner">
                                        <input type="text" data-slider="true" data-slider-range="4,50">
                                        <div class="sliderLabel">Find Events Within&nbsp;</div>
                                        <div class="sliderLabel output"></div>
                                        <div class="sliderLabel">&nbsp;Miles of <?php echo $yourpostcode; ?></div>
                                        <div class="sliderLabel"><a id="radButton">Find Them</a></div>
                                        <form id="radForm" method="post" action="events.php?type=rad&from=<?php echo $from; ?>">
                                            <input type="hidden" id="radSearch" name="var" />
                                        </form>
                                    </div>

$("[data-slider]")
.bind("slider:ready slider:changed", function (event, data) {
  $(this)
    .nextAll(".output:first")
    .html(data.value.toFixed(0));
    var slider = $(this).val();
    $('#radSearch').val(slider);
});

JS = http://jsfiddle.net/bxbzc/

Upvotes: 1

Views: 52

Answers (1)

Hacknightly
Hacknightly

Reputation: 5144

You need to change your slider variable to be an integer like so

var slider = parseInt($(this).val(), 10);

http://jsfiddle.net/bxbzc/1/

Upvotes: 1

Related Questions