Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Increment value of textinput with jquery like spinner

Trying to create a simple spinner effect with Jquery, i.e. two buttons (up & down) with a text field. The upbutton increases the value while the down button decreses the value. increment steps + or - 1.

Any suggestions as ui.spinner is most def. not working and I am new to jquery. musty be something like $(#up).click (function ( /*SOMETHING GOES IN HERE but what?*/ )) and likewise for #down. both to set adjust the input text field say id #test as above.

like image 649
russell Avatar asked Dec 03 '22 06:12

russell


1 Answers

Demo: http://jsbin.com/akiki

<button id="inc">+</button>
<button id="dec">-</button>
<input type="text" name="qty" value="0" />

<script type="text/javascript">
  $(function(){
    $("#inc").click(function(){
      $(":text[name='qty']").val( Number($(":text[name='qty']").val()) + 1 );
    });
    $("#dec").click(function(){
      $(":text[name='qty']").val( Number($(":text[name='qty']").val()) - 1 );
    });
  });
</script>
like image 169
Sampson Avatar answered Dec 11 '22 10:12

Sampson