press button and value increases in text box

So when the page loads the text box will contain a stored value. I want the user to press the ‘+’ button and the value in the text box will increase by one. Im guessing this is done with JQuery…Any ideas on where to get started so far I have…

<input type="text" name="BoqTextBox" id="BoqTextBox" value="0" />  
    <input type="Button" value="+" onclick="AddOne(document.getElementById('BoqTextBox').value)" />

    <script>
        function Add(data) {
            //so the current digit is passed to here, where I need to do some funky code
            //where it increments the current digit by one and stores it in BoqTextBox - replacing the old digit.

            //Also to note if the text box contains 124.54 for example and + is pressed
            //then new value will be 125.54
        }
    </script>

Any assistance with this would be great.

Thank you

…something like data = data + 1, but then how do I return the value into the text box?

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

You can use jQuery’s val() to fetch and set a value. In this case the code you need could look like this (demo):

<input type="text" name="BoqTextBox" id="BoqTextBox" value="0" />
<input type="Button" id='AddButton' value="+" />
<script>
$('#AddButton').on('click', function () {
    var input = $('#BoqTextBox');
    input.val(parseFloat(input.val()) + 1);
})
</script>

Method 2

$('input[type="button"]').on('click', function() {  // bind click event to button
   $('#BoqTextBox').val(function() {      // change input value using callback
      return ++parseFloat( this.value, 10); // make value integer and increment 1
   })
});

Method 3

you are callin Addone function inline so that means your function should be AddOne()

try this

function AddOne(obj){
    var value=parseFloat(obj) + 1;
    $('#BoqTextBox').val(value);  
}

Method 4

 $("#buttonId").click(function()
 {        
    var txtBox = $("#boqtextbox"); 

    if(!isNaN(txtBox.val()))
    {
       txtBox.val(parsFloat(txtBox.val())+1) ;

    }else 
    {
       //do validation or set it to 0
       txtBox.val(0);
    }|

 });

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0