REQ: New Question Form ( new JavaScript Student )

S

Sue

In this code why is it that when I press the SUBMIT button the focus
only goes back to the Numeric field. What do I need to do to correct
this problem?

Sue




<html>

<head>
<title>JavaScript Project</title>
<SCRIPT LANGUAGE="JAVASCRIPT">
<!--Hide from old browsers
function Validate() {
var themessage = "You are required to complete the following fields:
";

// validate the Firstname
if (document.Register.FirstName.value=="") {
alert("Please enter your Firstname");
document.Register.FirstName.value="";
document.Register.FirstName.focus();
}

else {
// validate the Lastname
if (document.Register.LastName.value=="") {
alert("Please enter your Lastname");
document.Register.LastName.value="";
document.Register.LastName.focus();
}
else {

// validate Age as be numeric
var YearsOld=document.Register.Age.value;
var YearsOld=parseInt(YearsOld,10);
if (isNaN(YearsOld)) {
alert("Age is not numeric");
document.Register.Age.value="";
document.Register.Age.focus();
}
else {

// validate the @ sign and the period as being the fourth
from the last character in an e-mail address
var RegeMail=document.Register.email.value;
var atSign = RegeMail.indexOf("@");

var Period=document.Register.email.value;
var PPeriod = Period.indexOf('.');
var LPeriod = Period.length - 4;

if (RegeMail == "" || atSign == -1 || LPeriod !=
PPeriod) {
alert("Please enter a valid e-mail address");
document.Register.email.value = "";
document.Register.email.focus();
}
else{

// validate the Gender in a drop down menu
var sex=document.forms[0].Gender.selectedIndex;
if (sex==0) {
alert("You must select your GENDER from the drop-down
Menu.");
document.forms[0].Gender.focus();
}
else
{

//alert if fields are empty and cancel form submit
if (themessage == "You are required to complete the following fields:
") {
document.Register.submit();
}
else {
alert(themessage);
return false;
}
}
}
}
}
}
}

//-->
</script>
</head>

<body>

<center>

<form name=Register method="post" action="">
<table border="0" width="90%">

<!-- Begining of the first line of the form for entering data. -->
<tr>
<td>Enter Your Firstname :</td><td align="center">
<Input Type="text" Name="FirstName" value=" "></td>
<td>&nbspEnter Your Age :</td> <td align="center">
<Input Type="numeric" Name="Age" value=" "></td>
<td align="center">Select your : <SELECT NAME="Gender" SIZE=1 >
<OPTION SELECTED VALUE=""> --- Select Gender ---
<OPTION VALUE="Male">Male
<OPTION VALUE="Female">Female
</SELECT>
</td>
</tr>
<!-- ending of the first line of the form for entering data. -->
<tr>
<td></td>
</tr>

<!-- Begining of the second line of the form for entering data. -->
<tr>
<td align="center">Enter Your Lastname :</td><td align="center">
<Input Type="text" Name="LastName" value=" "></td>
<td align="center">Enter Your Email Address :</td> <td
align="center">
<Input Type="text" Name="email" value=" "></td>
<td align="right"><input type=button value="Submit Request"
onclick="Validate();">
<Input Type="Reset"></td>
</tr>
<!-- ending of the second line of the form for entering data. -->

</body>
</html>
 
L

Lee

Sue said:
In this code why is it that when I press the SUBMIT button the focus
only goes back to the Numeric field. What do I need to do to correct
this problem?

In the HTML, you set the initial value of the fields to a single space
character:
<Input Type="text" Name="LastName" value=" "></td>

Your Validate() code checks to see if the fields are empty.
A single space character is not the same as an empty field.
Change your HTML value attributes to "".
 
S

Sue

Sue said:

In the HTML, you set the initial value of the fields to a single space
character:


Your Validate() code checks to see if the fields are empty.
A single space character is not the same as an empty field.
Change your HTML value attributes to "".

Hey Lee,

Thanks for explaining that to me. Now one last question before I have
to turn this project in on Friday.

This is not necessary for my project but I have created a function to
do more extensive checking for numbers in the Age field. However, I am
unable to insert this function into the code without it causing
problems. Is there an easy fool proof way to call this function
without a lot of difficulty. Thanks

Sue


function CheckAge(Age) {
var valid = "0123456789"
var Good = "yes";
var Check;
for (var i=0; i<Age.value.length; i++) {
Check = "" + Age.value.substring(i, i+1);
if (valid.indexOf(Check) == "-1") Good = "no";
}
if (Good == "no") {
alert("An INVALID Character has been entered for your age !");
document.Register.Age.value="";
document.Register.Age.focus();
}
}
 
T

Thomas 'PointedEars' Lahn

Sue said:
This is not necessary for my project but I have created a function to
do more extensive checking for numbers in the Age field. However, I am
unable to insert this function into the code without it causing
problems. Is there an easy fool proof way to call this function
without a lot of difficulty. Thanks
[...]
function CheckAge(Age) {

function checkAge(age)
{

(Note that the case changed for good style.)
var valid = "0123456789"
var Good = "yes";

Do not use strings for booleans, use booleans.

var good = true;

But you will not need that initialization and the `valid'
variable if you use Regular Expressions and write
var Check;

var check;
for (var i=0; i<Age.value.length; i++) {
Check = "" + Age.value.substring(i, i+1);

check = age.charAt(i);

is, although not required for the RegExp solution, far more simple.
Even with String.substring(...) the concatenation with "" is not
required since String.substring(...) already returns a `string' value.
if (valid.indexOf(Check) == "-1") Good = "no";
}

var good = /^\d+$/.test(age); // Only one or more decimal digit?
if (Good == "no") {

if (! good)
{
alert("An INVALID Character has been entered for your age !");
document.Register.Age.value="";
document.Register.Age.focus();

var oAge = document.forms["Register"].elements["Age"];
oAge.value = "";
oAge.focus();
}


HTH

PointedEars
 
S

Sue

Sue said:
This is not necessary for my project but I have created a function to
do more extensive checking for numbers in the Age field. However, I am
unable to insert this function into the code without it causing
problems. Is there an easy fool proof way to call this function
without a lot of difficulty. Thanks
[...]
function CheckAge(Age) {


<snip>

Thomas,

I tried to make the changes you suggested but some of this is over my
head. The charAt(i) has not been in any of the chapters that I have
had to do and I have done every chapter in the book this quarter. For
self gratification I would like to be able to plug this code into my
project but I have been unable to plug it in with out it causing
problems and my time is up tomorrow (Friday).



function checkAge(age) {
var valid = "0123456789"
var good = true;
var check;
for (var i=0; i<Age.value.length; i++) {
check = age.charAt(i);
var good = /^\d+$/.test(age); // Only one or more decimal digit?
}
if (! good) {
alert("An INVALID Character has been entered for your age !");
var oAge = document.forms["Register"].elements["Age"];
oAge.value = "";
oAge.focus();
}
}
 
T

Thomas 'PointedEars' Lahn

[posted & mailed (the latter accidentally, though)]
I tried to make the changes you suggested but some of this is over my
head. The charAt(i) has not been in any of the chapters that I have
had to do and I have done every chapter in the book this quarter.

It looks like you have one of the plenty of badly written JavaScript
books out there (see also the FAQ, there is only *one* which can be
recommended): charAt(...) is a *basic* method of the String prototype,
returning the character of the respective String (object) at the index
`i' (where the index is zero-based). Throw the book away and read the
specs instead (as you see, you can download the entire Guide/Reference
to your local hard disk; I have reconfigured my local Web server for
quick access which I can recommend you, too):

http://devedge.netscape.com/library/manuals/
For self gratification I would like to be able to plug this code into
my project but I have been unable to plug it in with out it causing
problems and my time is up tomorrow (Friday).

Search the index of the JavaScript 1.x Core Guide/Reference, it is
the fastest way to find what you are looking for. Here's the working
function (only snipped the parts no longer necessary):

function checkAge(age) {
var good = /^\d+$/.test(age); // Only one or more decimal digit?
if (! good)
{
alert("An INVALID Character has been entered for your age!");
var oAge = document.forms["Register"].elements["Age"];
oAge.value = "";
oAge.focus();
}
}

A little bit more optimization is possible, removing another unnecessary
variable:

function checkAge(age) {
// Does it contain a character other than a decimal digit?
if (! /^\d+$/.test(age))
{
alert("An INVALID Character has been entered for your age!");
var oAge = document.forms["Register"].elements["Age"];
oAge.value = "";
oAge.focus();
}
}

I guess you need that for form validation, so you would instead write:

<script type="text/javascript">
<!--
function checkAge(oAge) { // pass a reference to the obj. 2b checked
// Does it contain a character other than a decimal digit?
if (! /^\d+$/.test(oAge.value))
{
alert("An INVALID Character has been entered for your age!");
oAge.value = "";

if (typeof oAge.focus == "function"
|| typeof oAge.focus == "object")
{
oAge.focus();
}

return false;
}

return true;
}
//-->
</script>

<form action="..." onsubmit="return checkAge(this.elements['Age']);">
...
<input name="Age">
...
</form>

You should always pass references to a form-processing function instead
of primitive values as they are not that error-catching and you can use
them also within the function, without retrieving them (via collections)
again.


HTH

PointedEars
 
S

Sue

[posted & mailed (the latter accidentally, though)]
I tried to make the changes you suggested but some of this is over my
head. The charAt(i) has not been in any of the chapters that I have
had to do and I have done every chapter in the book this quarter.

It looks like you have one of the plenty of badly written JavaScript
books out there (see also the FAQ, there is only *one* which can be
recommended): charAt(...) is a *basic* method of the String prototype,
returning the character of the respective String (object) at the index
`i' (where the index is zero-based). Throw the book away and read the
specs instead (as you see, you can download the entire Guide/Reference
to your local hard disk; I have reconfigured my local Web server for
quick access which I can recommend you, too):

http://devedge.netscape.com/library/manuals/
For self gratification I would like to be able to plug this code into
my project but I have been unable to plug it in with out it causing
problems and my time is up tomorrow (Friday).

Search the index of the JavaScript 1.x Core Guide/Reference, it is
the fastest way to find what you are looking for. Here's the working
function (only snipped the parts no longer necessary):

function checkAge(age) {
var good = /^\d+$/.test(age); // Only one or more decimal digit?
if (! good)
{
alert("An INVALID Character has been entered for your age!");
var oAge = document.forms["Register"].elements["Age"];
oAge.value = "";
oAge.focus();
}
}

A little bit more optimization is possible, removing another unnecessary
variable:

function checkAge(age) {
// Does it contain a character other than a decimal digit?
if (! /^\d+$/.test(age))
{
alert("An INVALID Character has been entered for your age!");
var oAge = document.forms["Register"].elements["Age"];
oAge.value = "";
oAge.focus();
}
}

I guess you need that for form validation, so you would instead write:

<script type="text/javascript">
<!--
function checkAge(oAge) { // pass a reference to the obj. 2b checked
// Does it contain a character other than a decimal digit?
if (! /^\d+$/.test(oAge.value))
{
alert("An INVALID Character has been entered for your age!");
oAge.value = "";

if (typeof oAge.focus == "function"
|| typeof oAge.focus == "object")
{
oAge.focus();
}

return false;
}

return true;
}
//-->
</script>

<form action="..." onsubmit="return checkAge(this.elements['Age']);">
...
<input name="Age">
...
</form>

You should always pass references to a form-processing function instead
of primitive values as they are not that error-catching and you can use
them also within the function, without retrieving them (via collections)
again.


HTH

PointedEars


Thanks Thomas,

I check out your url and recommend to the instructor that he list is
as an aid in future class.

Sue
 
L

Lasse Reichstein Nielsen

Sue said:
Thanks Thomas,

Please reduce your quotes. There is no need to include 96 lines of quotes
to add four lines of answer.
I check out your url and recommend to the instructor that he list is
as an aid in future class.

One or two lines of quotes would be sufficient to give the context needed
to understand your answer.

/L
 
T

Thomas 'PointedEars' Lahn

Sue said:
[...]
Sue said:
I tried to make the changes you suggested but some of this is over my
head. The charAt(i) has not been in any of the chapters that I have
had to do and I have done every chapter in the book this quarter.

It looks like you have one of the plenty of badly written JavaScript
books out there (see also the FAQ, there is only *one* which can be
recommended): charAt(...) is a *basic* method of the String prototype,
returning the character of the respective String (object) at the index
`i' (where the index is zero-based). Throw the book away and read the
specs instead (as you see, you can download the entire Guide/Reference
to your local hard disk; I have reconfigured my local Web server for
quick access which I can recommend you, too):

http://devedge.netscape.com/library/manuals/
[...]

Thanks Thomas,

You are welcome, but please trim your quotes to the part(s) you are
actually referring to the next time. Time, bandwidth and disk space
are precious resources.
I check out your url and recommend to the instructor that he list is
as an aid in future class.

Good idea.


PointedEars
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top