Reputation: 1
I have a simple jquery slider, where I would like to update max:value by entering the amount in input field. Here is what I have so far:
<input name="cost" type="text" class="inputbox" size="10" id="cost" />
<label for="status">Progress Bar:</label>
<input type="text" id="status" style="border:0; color:#158FB6;font-weight:bold; background-color:#F8F8F8" name="status"/>
<div id="status-range" style="width: 250px;margin-top:2px"></div>
$(function() {
$( "#status-range" ).slider({
value:0,
min: 0,
max: 0,
slide: function(event, ui) {
$("#status").val("$" + ui.value);
}
});
$("#status").val("$" + $("#status-range").slider("value"));
});
Now when user enters value in cost field I want max:0 to be updated automatically.
Upvotes: 0
Views: 1057
Reputation: 7032
Add this event listener:
$('#cost').change(function() {
$('#status-range').slider('option','max',$(this).val());
});
Upvotes: 1