Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

Validate a textbox to accept onlt positive integers

Posted on 2006-07-18
12
787 Views
Last Modified: 2010-04-06
Hi,

I have a textbox. I want the users tp be able to enter a positive no. only in that HTML textbox. How can I do this? If the users enter a non positive integer value/character, then they should see error message that enter a positive no.

How to do that? Thanks for any help.

0
Comment
Question by:pmud
  • 4
  • 4
  • 3
  • +1
12 Comments
 
LVL 8

Expert Comment

by:Autogard
ID: 17132668
Great tutorial on form validation: http://www.xs4all.nl/~sbpoley/webmatters/formval.html

The basic idea is to use onchange events on the form elements that call the appropriate functions in the code in that tutorial.

Let me know if you need more specifics.
0
 
LVL 8

Accepted Solution

by:
Autogard earned 500 total points
ID: 17132704
Also another EE question in which the accepted answer demonstrates the "onchange" event.  You can check the fields when the fields change or on the submit (using onclick).  Actually, as the tutorial mentions, you should do both AND make sure you validate the data on the server side as well.

http://www.experts-exchange.com/Web/Web_Languages/JavaScript/Q_20653756.html

0
 
LVL 9

Expert Comment

by:owenli27
ID: 17133008
inside your HTML head, create a function like this:
<script  language="javascript">
function ValidateNum(frmName)
{
      var tempChar;
      var legalChar = "1234567890.-";

      for (var i = 0; i < frmName.tempNum.value.length; i++) {
            tempChar = frmName.tempNum.value.charAt(i)
            if (legalChar.indexOf(tempChar) < 0){
                  alert("Your message one....")
                  frmName.tempNum.focus();
                  return false;
            }
      }

      if(frmName.tempNum.value < 0){
            alert("Your message two....")
            frmName.tempNum.focus();
            return false;
      }
      return true;
}
</script>

in your HTML body:
<form>
<input type="text" name="tempNum"  value="" onBlur="ValidateNum(this.form)">
</form>
0
Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

 

Author Comment

by:pmud
ID: 17133148
Hi owenli,


I copied and pasted your exact code. But it didnt work.
0
 
LVL 8

Expert Comment

by:Autogard
ID: 17133205
What does it do?

Did you read through the tutorial I pointed you to?  It's not very long and will help you understand the topic better.
0
 
LVL 9

Expert Comment

by:owenli27
ID: 17133316
pmud,

I just test it and it works fine, is your browser setting allow scripts? This is HTML code I used for test:

<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script  language="javascript">
function ValidateNum(frmName)
{
     var tempChar;
     var legalChar = "1234567890.-";

     for (var i = 0; i < frmName.tempNum.value.length; i++) {
          tempChar = frmName.tempNum.value.charAt(i)
          if (legalChar.indexOf(tempChar) < 0){
               alert("Error message ONE....")
               frmName.tempNum.focus();
               return false;
          }
     }

     if(frmName.tempNum.value < 0){
          alert("Error message TWO....")
          frmName.tempNum.focus();
          return false;
     }
     return true;
}
</script>
</HEAD>

<BODY>
<form>
Number:
<input type="text" name="tempNum"  value="" onBlur="ValidateNum(this.form)">
</form>
</BODY>
</HTML>

0
 
LVL 9

Expert Comment

by:owenli27
ID: 17133456
BTW, you need to unFocus input box to trigger an action.  Even you change onBlur to onChange, it is same.
0
 

Author Comment

by:pmud
ID: 17133687
Hi owenli,

Below is what I am doing:

<script  language="javascript">
function ValidateNum(frmName,tempNum)
{
     var tempChar;
     var legalChar = "1234567890.-";

     for (var i = 0; i < frmName.tempNum.value.length; i++) {
          tempChar = frmName.tempNum.value.charAt(i)
          if (legalChar.indexOf(tempChar) < 0){
               alert("Error message ONE....")
               frmName.tempNum.focus();
               return false;
          }
     }

     if(frmName.tempNum.value < 0){
          alert("Error message TWO....")
          frmName.tempNum.focus();
          return false;
     }
     return true;
}
</script>

<INPUT name="num_days" accept  type="text"  class="textinput" value="#num_days#" size="3"
                                    onBlur="ValidateNum(this.alertform, num_days)">&nbsp;

I am not sure, whats wrong and I have unfocussed teh etxtbox but even then this doesnt work.

Thanks for any help.
0
 
LVL 9

Expert Comment

by:owenli27
ID: 17133882
You passed input box name to function, so you don't need "frmName" associated with tempNum! Change your function to
function ValidateNum(frmName, tempNum)
{
     var tempChar;
     var legalChar = "1234567890.-";

     for (var i = 0; i < tempNum.value.length; i++) {
          tempChar = tempNum.value.charAt(i)
          if (legalChar.indexOf(tempChar) < 0){
               alert("Error message ONE....")
               tempNum.focus();
               return false;
          }
     }

     if(tempNum.value < 0){
          alert("Error message TWO....")
          tempNum.focus();
          return false;
     }
     return true;
}
0
 

Author Comment

by:pmud
ID: 17134327
Hi,

The following worked for me:

<script  language="javascript">
      function formSubmit(inp)
      {
        if ((inp.value+"").match(/^[0-9]*$/))
             {
                   return true;
              }
             else
                  alert("Please enter a valid number")
                  return false;    
      }
</script>

<INPUT name="num_days" accept  type="text"  class="textinput" value="#num_days#" size="3"
                                    onBlur="formSubmit(num_days)">

Thanks
0
 
LVL 24

Expert Comment

by:fridom
ID: 17146226
What if someone has JavaScript disabled?

This code simply would not work. So go figure

Friedrich
0
 
LVL 8

Expert Comment

by:Autogard
ID: 17148299
The tutorial I posted at the top talks about what to do if javascript is disabled.  It's nice.
0

Featured Post

Networking for the Cloud Era

Join Microsoft and Riverbed for a discussion and demonstration of enhancements to SteelConnect:
-One-click orchestration and cloud connectivity in Azure environments
-Tight integration of SD-WAN and WAN optimization capabilities
-Scalability and resiliency equal to a data center

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Display local folder content (sub folders & files (not hidden)) using JavaScript 4 72
xml xsd validation free tool to download 10 92
PHP parse error 7 61
Select distinct 25 116
What is Node.js? Node.js is a server side scripting language much like PHP or ASP but is used to implement the complete package of HTTP webserver and application framework. The difference is that Node.js’s execution engine is asynchronous and event…
Styling your websites can become very complex. Here I'll show how SASS can help you better organize, maintain and reuse your CSS code.
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

828 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question