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?
Click to expand...

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

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 "".
Click to expand...

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) {
Click to expand...

function checkAge(age)
{

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

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;
Click to expand...

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

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";
}
Click to expand...

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

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

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


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) {
Click to expand...
Click to expand...


<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.
Click to expand...

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).
Click to expand...

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.
Click to expand...

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).
Click to expand...

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
Click to expand...


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,
Click to expand...

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.
Click to expand...

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.
Click to expand...

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/
[...]
Click to expand...

Thanks Thomas,
Click to expand...

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.
Click to expand...

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

Similar Threads

Can someone tell me if this a real tracker? Or is it one designed to show you a different message at certain times, ie. acting like one? 0
REQ: Could Someone assist in correcting this code ::::::::>>>(New JavaScript Student) 7
Javascript DOM 1
Registration form 13
Only one table shows up with the information 2
Help needed with thank you message 5
Uncaught ReferenceError: item is not defined at HTMLButtonElement.onclick in the: <button onclick="item.inserir()">Inserir dados</button> 1
How to create a JSON array with values from DOM(HTML TABLE) when I click a button using JQuery/Javascript? 0

Members online

Total: 79 (members: 2, guests: 77)
Robots: 416

Forum statistics

Threads
473,994
Messages
2,570,223
Members
46,814
Latest member
SpicetreeDigital

Latest Threads

Top