- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
how to increase value on text box and decrease by click on button
explain and any code please

- Tags:
- HTML5
- Intel® XDK
Link Copied
2 Replies
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
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> </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!
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
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
Reply
Topic Options
- Subscribe to RSS Feed
- Mark Topic as New
- Mark Topic as Read
- Float this Topic for Current User
- Bookmark
- Subscribe
- Printer Friendly Page