Software Archive
Read-only legacy content
17061 Discussions

increase the input number

zeroman_z_
Beginner
847 Views

 

how to increase value on text box and decrease by click on button 

explain and  any code please 

 

 

0 Kudos
2 Replies
Ad
New Contributor III
847 Views

add event handlers to your buttons and update text field

Sample HTML code

<a class="button widget" data-uib="app_framework/button"  id="btnUp">^</a>
<a class="button widget" data-uib="app_framework/button"  id="btnDown">V</a>
<div class="widget" data-uib="media/text" id="txtField" >
<div>
     <p>&nbsp;</p>
</div>

Sample JavaScript code

    var value = 0;
    $("#txtField").text(value);  
     
     /* button  #btnUp */
    $(document).on("click", "#btnUp", function(evt)
    {
         $("#txtField").text(++value);  
    });
     /* button  #btnDown */
    $(document).on("click", "#btnDown", function(evt)
    {
        if (value > 0) {
          $("#txtField").text(--value);  
        } 
    });

 

http://www.w3schools.com is a perfect place to start building up your knowledge!

 

 

 

0 Kudos
Chris_P_Intel
Employee
847 Views

Even simpler:  

<input type="number" value="0">

See this article for other options: http://www.htmlgoodies.com/html5/tutorials/whats-new-in-html5-forms-handling-numeric-inputs-using-the-number-and-range-input-types.html

0 Kudos
Reply