I use Jquery tools rangeinput.
For example I have:
<input id="testId" title="test" class="range" type="range" name="test" min="0" max="3000" value="15" />
And script:
$(".range").rangeinput();
$("#testId").live('change', function() {
console.log($(this).data("rangeinput").getValue());
});
So by default my value is 15. Then I type in my input 25, but result in console is 15, than I type 20, but result is 25. What am I doing wrong?
Thank you!
Try it this way instead. What's happening is the changed value isn't set before you call getValue. Calling setTimeout of 0 will fix that.
$(".range").rangeinput();
$(".range").live('change', function(){
var $range = $(this);
setTimeout(function(){
console.log($range.data('rangeinput').getValue());
}, 0);
});
If you can get rid of live and directly use change it will work because plugin uses the change event itself.
$("#testId").change(function() {
console.log($(this).data("rangeinput").getValue());
});
<span>Totar horizontalmente</span>
<input id="rota_hor" type='range' name='range' min='0' max='360' step='10' value='3' style="width: 350px;"/>
<script>
$("#rota_hor").change(function()
{
console.log($(this).attr("value"));
});
</script>
You must use jQuery Tools scripting data(toolname) API for access to values
<input id="myRange" name="some_name" type="range" value="20" min="0" max="100" step="10" />
<script>
var rangeApi = $('#myRange').rangeinput({
// Some settings here if it needed
}).data('rangeinput');
rangeApi.setValue(100);
console.log(rangeApi.getValue());
</script>
