Script Value Form Validation

**Erwin Moller** · Jul 23 '05, 04:27 PM

Re: Script Value Form Validation

Semi Head wrote:
[color=blue]
> Hello folks, I'm looking for a script to validate a specific number
> value in a standard form input field.
> An example would be, if someone enters a number into a form input, I
> want the script to validate it and give an alert if that the number
> exceeds the set script value.
> Like if the script value is set for 3000 and the number 3002 is
> entered, I want an alert to pop and give a warning,
>
> BTW - This script must be generic enough to work with older simple
> browsers.
>
> Hope someone can help.
>
>
> PapaJo's friend (S_H)[/color]

Hi

Your requerement is so basic, that the very earliest version of Javascript
could do it.
So don't worry.

This is how you proceed:
1) give your form a name (eg: myForm)
2) give the field you want to check a name (a textfield I suppose?) eg:
myTextfield

3) make an onChange-handler on that myTextfield that call some
validatingfunct ion.

So:

<form action="bla.php " name="myForm">
your age: <input type="text" onChange="check Value();" name="myTextFie ld">
<input type="submit">
</form>

<script type="text/javascript">
function checkValue(){
// get the value in
theValue = document.forms. myForm.myTextFi eld.value;
if (theValue>3000) {
alert("Are you really that old?");
}
}
</script>

Regards,
Erwin Moller

**Fred Oz** · Jul 23 '05, 04:27 PM

Re: Script Value Form Validation

Semi Head wrote:[color=blue]
> Hello folks, I'm looking for a script to validate a specific number
> value in a standard form input field.
> An example would be, if someone enters a number into a form input, I
> want the script to validate it and give an alert if that the number
> exceeds the set script value.
> Like if the script value is set for 3000 and the number 3002 is
> entered, I want an alert to pop and give a warning,
>
> BTW - This script must be generic enough to work with older simple
> browsers.
>
> Hope someone can help.[/color]

Gosh, this has been asked so many times....

function checkNum(n) {
var mx = 3000, // max value
mn = 0, // min value
msg = '';

if (n == parseInt(n,10)) {
msg = n + ' is an integer';
if (n >= mn && n <= mx) {
msg += '\nand it\'s within range';
} else {
msg += '\nbut it\'s outside the allowable range'
+ ' of ' + mn + ' to ' + mx;
}
} else {
msg = n + ' is not an integer';
}
return msg;
}
</script>

[...]

<label for="num">Enter a value (0 to 3000)
<input type="text" name="num" size="30" value="">
</label>
<input type="button" value="click me" onclick="
alert(checkNum( this.form.num.v alue));">

Untested on "older simple browsers" but I expect it will work on
anything that supports JavaScript and forms.

It can also be done with regEx, but I like the parseInt method as
it checks that it's only digits and converts it to an integer at
the same time.

If you want to allow scientific notation (e.g. 0.3e3), that's a
little harder but not impossible:

You have the choice of returning either the original entered text
or the parsed integer which will have leading zeros removed.

In regard to using "onchange", it is problematic as you can
change the field then click submit and in some browsers the field
doesn't lose focus so the onchange doesn't fire. It can also be
very frustrating for users if they can't leave a field until it
is properly validated, so generally validation is done onsubmit,
returning false to cancel the submit.

And lastly, have onscreen tips to let users know what the min and
max values are before they enter anything.

--
Fred

**Dr John Stockton** · Jul 23 '05, 04:28 PM

Re: Script Value Form Validation

JRS: In article <28476-41DE5686-1020@storefull-3118.bay.webtv. net>,
dated Fri, 7 Jan 2005 03:29:42, seen in news:comp.lang. javascript, Semi
Head <semi_head@webt v.net> posted :[color=blue]
> Hello folks, I'm looking for a script to validate a specific number
>value in a standard form input field.
> An example would be, if someone enters a number into a form input, I
>want the script to validate it and give an alert if that the number
>exceeds the set script value.
>Like if the script value is set for 3000 and the number 3002 is
>entered, I want an alert to pop and give a warning,
>
>BTW - This script must be generic enough to work with older simple
>browsers.[/color]

I prefer to test such with a RegExp.

This works with IE4 :

function Chk(xx) { var x = xx.value, OK
OK = /^\d+$/.test(x)
if (!OK) { alert('Format!' ) ; xx.focus() ; return }
x = +x
if (x>3000) { alert('Value!') ; xx.focus() ; return }
return x }

Chk(F.X0)

The first + can be replaced by {1,4} if having too many digits is to be
considered a format error.

Or function Chk(xx) { var x = xx.value, OK
OK = /^\d+$/.test(x)
if (!OK || (x=+x)>3000) { alert('OW!') ; xx.focus() ; return }
return x }

Or function Chk(xx) { var x = xx.value, OK
OK = /^\d+$/.test(x)
if (OK && (x=+x)<=3000) return x
alert('OW!') ; xx.focus() ; return }

Or function Chk(xx) { var x = xx.value
if (/^\d+$/.test(x) && (x=+x)<=3000) return x
alert('OW!') ; xx.focus() ; return }

<URL:http://www.merlyn.demo n.co.uk/js-valid.htm>.

--
© John Stockton, Surrey, UK. ?@merlyn.demon. co.uk Turnpike v4.00 IE 4 ©
<URL:http://www.jibbering.c om/faq/> JL/RC: FAQ of news:comp.lang. javascript
<URL:http://www.merlyn.demo n.co.uk/js-index.htm> jscr maths, dates, sources.
<URL:http://www.merlyn.demo n.co.uk/> TP/BP/Delphi/jscr/&c, FAQ items, links.

**Semi Head** · Jul 23 '05, 04:28 PM

Re: Script Value Form Validation

Originally Semi Head (S_H) wrote:
      Hello folks, I'm looking for a script to validate a
specific number value in a standard form input field.
    An example would be, if someone enters a number into a form
input, I want the script to validate it and give an alert if that the
number exceeds the set script value.
Like if the script value is set for 3000 and the number 3002 is entered,
I want an alert to pop and give a warning,
BTW - This script must be generic enough to work with older simple
browsers.
                Hope someone can help.
                              PapaJo's
friend (S_H)
-------------------------------------------

Response #1

From: since_humans_re ad_this_I_am_sp am...yourself.co m
(Erwin Moller)

Hi
Your requerement is so basic, that the very earliest version of
Javascript could do it.
So don't worry.
This is how you proceed:
1) give your form a name (eg: myForm)
2) give the field you want to check a name (a textfield I suppose?) eg:
myTextfield
3) make an onChange-handler on that myTextfield that call some
validatingfunct ion.

So:
<form action="bla.php " name="myForm">
your age: <input type="text" onChange="check Value();"
name="myTextFie ld">
<input type="submit">
</form>
<script type="text/javascript">
function checkValue(){
      // get the value in
      theValue = document.forms. myForm.myTextFi eld.value;
if (theValue>3000) {
          alert("Are you really that old?");
    }
}
</script>

Regards,
Erwin Moller

-------------------------------------------

Response #2

From: ozfred@iinet.ne t.auau (Fred Oz)

    Gosh, this has been asked so many times....
    function checkNum(n) {
  var mx = 3000, // max value
            mn = 0, // min value
      msg = '';
    if (n == parseInt(n,10)) {
    msg = n + ' is an integer';
    if (n >= mn && n <= mx) {
            msg += '\nand it\'s within range';
    } else {
            msg += '\nbut it\'s outside the
allowable range'
                      + ' of
' + mn + ' to ' + mx;
        }
    } else {
    msg = n + ' is not an integer';
    }
    return msg;
    }
</script>
[...]
      <label for="num">Enter a value (0 to 3000)
<input type="text" name="num" size="30" value="">
      </label>
      <input type="button" value="click me" onclick="
alert(checkNum( this.form.num.v alue));">
    Untested on "older simple browsers" but I expect it will
work on anything that supports JavaScript and forms.
    It can also be done with regEx, but I like the parseInt
method as it checks that it's only digits and converts it to an integer
at the same time.
    If you want to allow scientific notation (e.g. 0.3e3),
that's a little harder but not impossible:
    You have the choice of returning either the original entered
text or the parsed integer which will have leading zeros removed.
    In regard to using "onchange", it is problematic as you can
change the field then click submit and in some browsers the field
doesn't lose focus so the onchange doesn't fire. It can also be very
frustrating for users if they can't leave a field until it is properly
validated, so generally validation is done onsubmit, returning false to
cancel the submit.
    And lastly, have onscreen tips to let users know what the
min and max values are before they enter anything.
--
Fred
------------------------------------------

Response #3

From: spam@merlyn.dem on.co.uk (Dr John Stockton)

I prefer to test such with a RegExp.
This works with IE4 :
                function Chk(xx) { var x
= xx.value, OK
          OK = /^\d+$/.test(x)
                    if (!OK) {
alert('Format!' ) ; xx.focus() ; return }
                    x = +x
                    if (x>3000)
{ alert('Value!') ; xx.focus() ; return }
          return x }
                Chk(F.X0)
The first + can be replaced by {1,4} if having too many digits is to be
considered a format error.
Or function Chk(xx) { var x = xx.value, OK
          OK = /^\d+$/.test(x)
                    if (!OK ||
(x=+x)>3000) { alert('OW!') ; xx.focus() ; return }
          return x }
Or function Chk(xx) { var x = xx.value, OK
          OK = /^\d+$/.test(x)
                    if (OK &&
(x=+x)<=3000) return x
          alert('OW!') ; xx.focus() ; return }
Or function Chk(xx) { var x = xx.value
          if (/^\d+$/.test(x) && (x=+x)<=3000)
return x
          alert('OW!') ; xx.focus() ; return }

---------------------------------------------------

Sorry, i was unable to smallify the text of the posted responses do to
browser limitations.
i hope my response will be accepted as adequate.
Thank you all, for posting your scripts & suggestions.
All of them worked but i believe Erwin Moller's script will be the best
for Papajoe's WebTV browser application.
Thank you again!
You are a fair & generous group of JS scripting professionals

take care,
Papajoe's friend (S_H)

Script Value Form Validation

Script Value Form Validation

Comment

Comment

Comment

Comment