Wrox Programmer Forums
Go Back   Wrox Programmer Forums > Web Programming > JavaScript > Javascript How-To
|
Javascript How-To Ask your "How do I do this with Javascript?" questions here.
Welcome to the p2p.wrox.com Forums.

You are currently viewing the Javascript How-To section of the Wrox Programmer to Programmer discussions. This is a community of software programmers and website developers including Wrox book authors and readers. New member registration was closed in 2019. New posts were shut off and the site was archived into this static format as of October 1, 2020. If you require technical support for a Wrox book please contact http://hub.wiley.com
 
Old November 17th, 2004, 05:30 AM
Authorized User
 
Join Date: Jul 2003
Posts: 56
Thanks: 0
Thanked 0 Times in 0 Posts
Default Checking validation of a textbox on submit

Hi there

I am very new to Javascript and my knowledge is somewhat limited. I have a textbox called rquan which is a quantity field. At the moment i've managed to set up validation on clicking the submit button to do the following:
flag message is box is empty
flag message if value is 0
flag message if value is greater than another box (ship)
(see code below if it helps!!)

function ProcessForm()
{
    if (document.forms['returnform'].elements['rquan'].value > document.forms['returnform'].elements['ship'].value)
    {
        alert("The Return Quantity cannot be greater than the Shipped Quantity.");
        document.forms['returnform'].elements['rquan'].focus();
        return;
    }

    if (document.forms['returnform'].elements['rquan'].value == "")
    {
        alert("Please enter the Return Quantity in the Return Quantity field.");
        document.forms['returnform'].elements['rquan'].focus();
        return;
    }

      document.forms['returnform'].submit();
}

This all works fine.

Now what I need to do is set up validation so that only numeric values are accepted, and only non-negative values. At the moment I can put in -A and it works fine! I thought having the one that checks for values greater than 0 would sort out the negative bit but it doesn't!!

Can anyone help me with the code cos I don't know what i'm doing!!

Thanks in advance

Lucy

 
Old November 17th, 2004, 06:05 AM
Friend of Wrox
 
Join Date: May 2004
Posts: 642
Thanks: 0
Thanked 43 Times in 42 Posts
Default

Please check the following javascript numeric check function:

http://www.shiningstar.net/articles/...c.asp?ID=ROLLA



Om Prakash
 
Old November 18th, 2004, 03:14 PM
Authorized User
 
Join Date: Nov 2004
Posts: 10
Thanks: 0
Thanked 0 Times in 0 Posts
Send a message via AIM to ophillip
Default

Try using the isNaN function to test your value. Example:

myVar1 = isNaN("Hello");

   will return true because "Hello" is not a number, whereas

myVar1 = isNaN(34);

   will return false because 34 is a number.

if (isNaN(document.forms['returnform'].elements['rquan'].value))
{
alert("Please enter numeric values only.");
}

You can also use the not operator (!) if you want to reverse the result.
 
Old November 18th, 2004, 05:21 PM
Friend of Wrox
 
Join Date: Jun 2003
Posts: 344
Thanks: 0
Thanked 1 Time in 1 Post
Default

Regular Expressions such as

\d

could also be used, see http://builder.com.com/article.jhtml...30224gcn01.htm
 
Old November 19th, 2004, 06:38 AM
Authorized User
 
Join Date: Jul 2003
Posts: 56
Thanks: 0
Thanked 0 Times in 0 Posts
Default

A big thank you to everyone who posted replies. I have now got my javascript checking to validate the form on submit! I went with the isNaN option in the end, but will keep all your comments for future coding. One thing I have noticed, and i'm not sure if it's a javascript thing or an asp thing (perhaps someone can enlighten me!) but if i'm in my textfield and i hit 'enter' on the keyboard, it submits my form without going through all the javascript validation - very odd!

Any ideas?

Cheers

Lucy

 
Old November 19th, 2004, 06:43 AM
Friend of Wrox
 
Join Date: Jul 2003
Posts: 683
Thanks: 0
Thanked 1 Time in 1 Post
Default

Hi Lucy,

How are you calling the validation function?

If you add the function call to the form tags onsubmit attribute, it will get called when you hit enter.

HTH,

Chris

 
Old November 23rd, 2004, 06:35 AM
Authorized User
 
Join Date: Jul 2003
Posts: 56
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Hi Chris

Thanks for getting back to me. I'm not really a javascript bod so have 'lifted' the code from a page done previously and amended to suit my needs! So, got Javascript function at the top of my page....

<script language="javascript">

function ProcessForm()
{
    if (isNaN(document.forms['returnform'].elements['rquan'].value))
    {
        alert("Please enter numeric values only in the Return Quantity field.");
        document.forms['returnform'].elements['rquan'].focus();
        return;
    }

      document.forms['returnform'].submit();
}
</script>

then form tag surrounding my textbox with image button as my submit button....

<form name="returnform" id="returnform" method="post" action="confirmorder.asp">
<input name="rquan" type="text" id="rquan" size="3" />
<a href="javascript:ProcessForm();"><img border="0" src="/confirm_details.gif" width="140" height="24" /></a>
</form>

So, on clicking the submit button, the validation is done (javascript function called) and this then submits the info to confirmorder.asp page.

Do you, or does anyone else know, how I can do all this but not allow submission of the form on hitting the Enter key whilst in the textbox? I've simplified things here a little as I actually have a textarea box and a dropdown box also within my form, which come after the textbox - obviously if the user hits Enter, instead of Tab, the form is submitting, without the validation, and before the other boxes are filled in.

Thanks in advance

Lucy

 
Old November 23rd, 2004, 07:25 AM
Friend of Wrox
 
Join Date: May 2004
Posts: 642
Thanks: 0
Thanked 43 Times in 42 Posts
Default

Hi,

 Please check the following updated code:

<script language="javascript">

function ProcessForm()
{

    if (document.forms['returnform'].elements['rquan'].value == "")
    {
            alert("Please enter some value");
            document.forms['returnform'].elements['rquan'].focus();
            return false;
    }
    else
    {
        if (isNaN(document.forms['returnform'].elements['rquan'].value))
        {
            alert("Please enter numeric values only in the Return Quantity field.");
            document.forms['returnform'].elements['rquan'].focus();
            return false;
        }
    }

}
</script>

then form tag surrounding my textbox with image button as my submit button....

<form name="returnform" id="returnform" method="post" action="atest.asp" onsubmit="return ProcessForm();">
<input name="rquan" type="text" id="rquan" size="3" />
<input type=image src="/confirm_details.gif" width="140" height="24" /></a>
</form>


Thanks

Om Prakash





Similar Threads
Thread Thread Starter Forum Replies Last Post
Submit form and validation ind IE 6.0 and Firefox Leholt Classic ASP Basics 2 February 2nd, 2008 11:48 AM
Textbox validation rhd110 .NET Framework 2.0 1 March 28th, 2007 02:49 PM
TextBox Validation Brettvan1 VB.NET 2002/2003 Basics 1 June 23rd, 2005 08:58 AM
checking string length for form validation Tachyon Beginning PHP 1 June 14th, 2004 08:16 PM
Form validation and email checking visionary Beginning PHP 9 July 15th, 2003 01:06 PM





Powered by vBulletin®
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
Copyright (c) 2020 John Wiley & Sons, Inc.