Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

Validate a textbox to accept onlt positive integers

Posted on 2006-07-18
12
Medium Priority
?
797 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
[X]
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
  • 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 2000 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
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 

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

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

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

There are two main kinds of selectors in CSS: One is base selector like h1, h2, body, table or any existing HTML tags.  For instance, the following rule sets all paragraphs (<p> elements) to red: (CODE) CSS also allows us to define our own custom …
JavaScript has plenty of pieces of code people often just copy/paste from somewhere but never quite fully understand. Self-Executing functions are just one good example that I'll try to demystify here.
Viewers will learn one way to get user input in Java. Introduce the Scanner object: Declare the variable that stores the user input: An example prompting the user for input: Methods you need to invoke in order to properly get  user input:
Viewers will learn about if statements in Java and their use The if statement: The condition required to create an if statement: Variations of if statements: An example using if statements:

721 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