I am trying to add a Jslider of price in my website.
here is the slider UI code in html
<div class="layout-slider">
<input id="Slider-price" type="slider" name="price" value="5;10" class="form-control" />
</div>
and the javascript is
<script type="text/javascript">
$('#Slider-price').slider({from: '5', to: '10', step: 1, dimension: ' $' });
</script>
The original code is works well. Whicj is as same as the above code. But when I include it to my website, the input value goes wrong.
Fro example, if I give value="5;10" in my code, after running, it changes to value="55;55" and the value in javascript have no changes at all. Because of this, it didn't work and the slider pointer located at the end of the slider and cant slide it. What is wrong with this? Please help
It's because the to/from values are surrounded by single quotes and therefore being interpreted as strings instead of integers.
'5' + '5' = '55'; // string concatenation
5 + 5 = 10; // numeric addition
Remove the quotes on the to/from values:
<script type="text/javascript">
$('#Slider-price').slider({
from: 5,
to: 10,
step: 1,
dimension: ' $'
});
</script>