Scott Windmiller Scott Windmiller - 5 months ago 20
jQuery Question

Increase textbox value by .25

I have a form that has a Service Time field that we want incremented by .25 upon each click of a + button.

I have the following code:

<script language=javascript>
$(document).ready(function(){
$("#up").on('click',function(){
$("#incdec input").val(parseFloat($("#incdec input").val())+0.25);
});

$("#down").on('click',function(){
$("#incdec input").val(parseFloat($("#incdec input").val())-0.25);
});
});
</script>


and the HTML part:

<div class="form-group" id="incdec">
<label for="Time" class="col-sm-2 control-label">Time:</label>
<div class="col-sm-10"><input name="Time" value="<%=rs.Fields.Item("Time")%>"></div>
<button id="up">+</button>
<button id="down">-</button>
</div>


This works just fine but upon clicking the + or - it increases/decreases but also submits the form it's in. I want to be able to just increase/decrease what is in the text field then submit the form with another button.

I know I am missing something stupid here!

Answer

The type attribute of a button defaults to "submit". You'll want to add type="button" to prevent submission from occurring.

See https://www.w3.org/TR/html5/forms.html#attr-button-type

Comments