www.webdeveloper.com
Results 1 to 7 of 7

Thread: textbox to accept only numbers (digits)

  1. #1
    Join Date
    Oct 2012
    Location
    istanbul
    Posts
    64

    textbox to accept only numbers (digits)

    Hello,

    This code, how to use for multi-input?

    http://jsfiddle.net/lesson8/HkEuf/1/

    Thank you in advance

  2. #2
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,648
    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>Digits only</title>
    <style type="text/css">
    body{color:#000;background-color:#fff;font-family:'Bookman Old Style',Georgia,Verdana;font-size:14px;}
    input{text-align:center;margin-top:5px;}
    span.err{display:none;color:Crimson;padding-left:5px;font-weight:bold;}
    </style>
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
    $('input[class=digs]').keypress(function(e){
    if(e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)){
    $(this).next().html("Digits Only").show().fadeOut("slow");
    return false;
    }
    });
    $('input[class=digs]:first').focus();
    });
    </script>
    </head>
    <body>
    <h4>Only digits</h4>
    <input class="digs" type="text" size="10" /><span class="err"></span><br />
    <input class="digs" type="text" size="10" /><span class="err"></span><br />
    <input class="digs" type="text" size="10" /><span class="err"></span><br />
    <h4>Any content</h4>
    <input type="text" size="10" />
    </body>
    </html>
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

  3. #3
    Join Date
    Oct 2012
    Location
    istanbul
    Posts
    64
    It was excellent,
    Thank you very much

  4. #4
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,648
    you're welcome )
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

  5. #5
    Join Date
    Mar 2011
    Posts
    1,137
    Or....

    If you can live without support from IE 6-8, you can just use HTML 5's:
    Code:
    <input type="number" min="1" max="100" required>
    ...and you can keep the JavaScript validation as a back-up, of course. Just a thought.
    Rick Trethewey
    Rainbo Design

  6. #6
    Join Date
    Oct 2012
    Location
    istanbul
    Posts
    64
    I have a small question:

    http://awesomescreenshot.com/0f81lvg155
    When the page refreshed, the cursor comes to there (see: img)
    The code below causes to that, Can I remove this code? Will any problem come?

    $('input[class=digs]:first').focus();

  7. #7
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,648
    of course you can. this line was only for convenience of the demonstration
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles