Please can you help with this Javascript? (Full Version)

All Forums >> [Web Development] >> General Web Development



Message

MartynB -> Please can you help with this Javascript? (11/2/2007 4:28:26)

Hi Guys.....

I have a very simple email form on a web page. It collects the writer's Name, Email Address and comments and has a Submit Information button to enable the writer to send the form to a program hosted on the web server. The web server processes the form and sends it to a specified email address.

At present one can just click the Submit Information button and the form is sent even though blank.

I've found another form that allows required fields to be entered and this is controlled by a Javascript function in the body of the page. I've pasted below my attempt a modifying the Javascript to suit my small form but because I've never written in Javascript per se it doesn't work. For anyone who has used Javascript I think that the solution would be a cinch.

If you could correct my Javascript I will be very much obliged and it will give my Javascripting a kickstart.

Many thanks in anticipation,

Martyn.

*** This is the Javascript that I wish to correct ***

<SCRIPT LANGUAGE="JavaScript">
function validate(){
var valid;
valid=true;
var valueExists;


if (document.forms[0].field_8.value==""){ valid=false; };
if (valid==false) {
alert('You did not fill in the Name field!');
}
if (document.forms[0].field_9.value==""){ valid=false; };
if (valid==false) {
alert('You did not fill in the Email Address field!');
}
if (document.forms[0].field_10.value==""){ valid=false; };

if (valid==false) {
alert('You did not enter any Comments!');
}

return valid;
}
</SCRIPT>

*** This is the form on which I wish the script to operate ***

<H2>Email us by filling out the form below:</H2>
<FORM name=questionary action=http://82.110.105.5:8080/servlet/psoft.customform.CustomForm method=post><INPUT type=hidden value=7 name=form_id>
<INPUT type=hidden value=25151 name=user_id>
<INPUT type=hidden value="IMSL - Contact Us" name=title>
<INPUT type=hidden value=email.html name=name>
<INPUT type=hidden value="8 9 10 " name=order>
<INPUT type=hidden value=http://82.110.105.93/imsl01.co.uk/onsubmit.html name=submit_url>
<INPUT type=hidden value=http://82.110.105.93/imsl01.co.uk/onerror.html name=error_url>
<TABLE>
<TBODY>
<TR><INPUT type=hidden value=Name name=name_8>
<TD><FONT face=Arial color=#000000 size=2>Name: </FONT></TD>
<TD><INPUT size=30 name=field_8></TD></TR>
<TR><INPUT type=hidden value=Email name=name_9>
<TD><FONT face=Arial color=#000000 size=2>Email: </FONT> </TD>
<TD><INPUT size=30 name=field_9></TD></TR>
<TR><INPUT type=hidden value=Comments name=name_10>
<TD><FONT face=Arial color=#000000 size=2>Comments: </FONT> </TD>
<TD><TEXTAREA name=field_10 rows=4 cols=40></TEXTAREA></TD></TR>
<TR>
<TD><BR/></TD></TR>
<TR>
<TD colSpan=2><INPUT type=submit value="Submit Information" onClick="return validate()"> </TD></TR></TBODY></TABLE></FORM>



rdouglass -> RE: Please can you help with this Javascript? (11/2/2007 7:26:19)

quote:

document.forms[0].field_8.value


Sometimes using "document.getElementById('field_8').value" works better.

Also, have you tried this page in FireFox? The JavaScript console there is extremely helpful when trying to debug JavaScripts.



MartynB -> RE: Please can you help with this Javascript? (11/2/2007 7:54:08)

Top class!

Thank you.

Is there also a Javascript command that will exit the processing of further conditional statements so that by missing just one required field no further tests are carried out on that pass of the validation code?

Also, if I may, if a required field is found to be empty can I set the focus into that field?



rdouglass -> RE: Please can you help with this Javascript? (11/2/2007 8:14:36)

quote:

if a required field is found to be empty can I set the focus into that field?


document.getElementById('field_8').focus();

That should work.

quote:

Javascript command that will exit the processing of further conditional statements


return false;

that should do it.

Hope it helps.



MartynB -> RE: Please can you help with this Javascript? (11/2/2007 8:23:21)

And so it does.

Thank you kindly.

Time for me to learn Javascript I believe.



MartynB -> RE: Please can you help with this Javascript? (11/3/2007 6:34:57)


quote:

ORIGINAL: MartynB

And so it does.




Well, almost! it works fine on the two text boxes but not on the TEXTAREA object. I've appended the modified code having done a crash course in JavaScript during the afternoon and evening I've tried the code shown and also tried adding an else clause to trigger the return valid.

What seems to be happening is either that the test on an empty Comments box (i.e. it hasn't got any typing in it) is failing or there is some unknown content in the control. Any further feedback on this area will be much appreciated.

*** This is the Javascript that I wish to correct ***

<SCRIPT LANGUAGE="JavaScript">
function validate(){
var valid;
valid=true;
var valueExists;


if (document.getElementById('field_8').value=="")
{
valid=false;
alert('You did not fill in the Name field!');
document.getElementById('field_8').focus();
return false;
}
else if (document.getElementById('field_9').value=="")
{
valid=false;
alert('You did not fill in the Email Address field!');
document.getElementById('field_9').focus();
return false;
}
else if (document.getElementById('field_10').value=="")
{
valid=false;
Alert('You did not enter any comments!');
document.getElementById('field_10').focus();
return false;
}
return valid;
}
</SCRIPT>

*** This is the form on which I wish the script to operate ***

<H2>Email us by filling out the form below:</H2></FONT>
<FORM name=questionary action=http://82.110.105.5:8080/servlet/psoft.customform.CustomForm method=post><INPUT type=hidden value=7 name=form_id>
<INPUT type=hidden value=25151 name=user_id>
<INPUT type=hidden value="IMSL - Contact Us" name=title> <INPUT type=hidden value=email.html name=name>
<INPUT type=hidden value="8 9 10 " name=order>
<INPUT type=hidden value=http://82.110.105.93/imsl01.co.uk/onsubmit.html name=submit_url>
<INPUT type=hidden value=http://82.110.105.93/imsl01.co.uk/onerror.html name=error_url>
<TABLE>
<TBODY>
<TR><INPUT type=hidden value=Name name=name_8>
<TD><FONT face=Arial color=#000000 size=2>Name: </FONT></TD>
<TD><INPUT size=30 name=field_8></TD></TR>
<TR><INPUT type=hidden value=Email name=name_9>
<TD><FONT face=Arial color=#000000 size=2>Email: </FONT> </TD>
<TD><INPUT size=30 name=field_9></TD></TR>
<TR><INPUT type=hidden value=Comments name=name_10>
<TD><FONT face=Arial color=#000000 size=2>Comments: </FONT> </TD>
<TD><TEXTAREA name=field_10 rows=4 cols=40></TEXTAREA></TD></TR>
<TR>
<TD><BR></TD></TR>
<TR>
<TD colSpan=2><INPUT type=submit value="Submit Information" onClick="return validate()"> </TD></TR></TBODY></TABLE></FORM>



rdouglass -> RE: Please can you help with this Javascript? (11/4/2007 15:24:17)

quote:

it works fine on the two text boxes but not on the TEXTAREA object.


What is it doing (or not doing)?



MartynB -> RE: Please can you help with this Javascript? (11/4/2007 18:00:38)

The script works perfectly in the two textboxes (for the name and email address) in that it traps null entries. In the textarea, however, the script appears to ignore a null entry and allow submission of the form. In effect a user can send a name, email address and no comment and this is what I wish to prevent.

I been doing some more crash JavaScript and think that I've worked out that if I use a .js file and a function I could pass the field to the function server-side and it would return an appropriate response. I must try this out.



rdouglass -> RE: Please can you help with this Javascript? (11/4/2007 22:14:23)

Are you sure there isn't a space in there? How 'bout checking the length of the text to see if its more than 5?

else if (document.getElementById('field_10').value.length>=5)

Maybe? Personally I'd try to solve the client side issue vs. the serverside solution.



mtfm -> RE: Please can you help with this Javascript? (11/5/2007 10:31:25)

I played with it a little, and it looks like the problem is that in that section "alert" is written with a capital A and JS is case-sensitive. Remove the capital and it seems to work OK.

I would also make some sort of email address verification, to at least ensure you have a @ and a .com or .org/whatever at the end. I have seen a tutorial or two out there will try ot dig it up for you.

<edit>I seem to have misplaced the bookmark I am loking for, but just google "javascript email validation" and you will get more than you can shake a stick at.

Andrew



MartynB -> RE: Please can you help with this Javascript? (11/5/2007 11:00:04)

Hi Andrew...

Well spotted - it was the capital A that was causing the problem.

Email validation is next. I need just to loop through the string to find the @ at least two characters in and a . at least two characters later.

I have found something else slightly peculiar. In Firefox the entire JavaScript code seems to be being ignored and I can successfully submit an empty form. In the Content option both JavaScript and Java are enabled (I'm using 2.0.0.9 of Firefox) so I'm somewhat surprised. I'll have a tinker with this and see where it takes me.

This thread seems to prove the adage that with a single fact the entire universe can be discerned. I'm certainly picking up on my JavaScript and your help (both of you) is much appreciated.

Many thanks



MartynB -> RE: Please can you help with this Javascript? (11/7/2007 9:36:14)

I did some digging to find JavaScript code that would validate an email address and found a solution on the following site: -

http://www.4wordsystems.com/index.php

Looking at the code itself I find that there is a copyright message included but, at least, it does provide a solution. Just ask there permission to use it (or find and alternate source).



William Lee -> RE: Please can you help with this Javascript? (11/7/2007 10:03:30)


quote:

ORIGINAL: MartynB

I did some digging to find JavaScript code that would validate an email address and found a solution on the following site: -

http://www.4wordsystems.com/index.php

Looking at the code itself I find that there is a copyright message included but, at least, it does provide a solution. Just ask there permission to use it (or find and alternate source).


Here's one javascript solution at www.w3schools.com that doesn't require copyright message.
http://www.w3schools.com/js/js_form_validation.asp



MartynB -> RE: Please can you help with this Javascript? (11/7/2007 10:37:10)

Thanks for that William.

Full marks for observation on my part - I'm using W3Schools to teach myself JavaScript and have a link to their site from mine!!!

[sm=fie.gif]



William Lee -> RE: Please can you help with this Javascript? (11/7/2007 10:40:40)


quote:

ORIGINAL: MartynB


Full marks for observation on my part - I'm using W3Schools to teach myself JavaScript and have a link to their site from mine!!!

[sm=fie.gif]

[sm=lol.gif]



MartynB -> RE: Please can you help with this Javascript? (11/7/2007 10:47:31)

I looked at the W3Schools link and I haven't reached that bit yet (Phew!)

I'm not sure that it covers all eventualities.

I found this site: -

http://sqa.fyicenter.com/Online_Test_Tools/Email_Address_Format_Validator.php

and it outlines what is and is not acceptable in an email address.

If this is correct (please tell me if there is any part that is incorrect) I shall keep studying to work out how to write a JavaScript routine that will do the same job as the PHP routine and will then post it to the forum. This will serve as a good learning exercise.

Just don't hold your breath guys!!



William Lee -> RE: Please can you help with this Javascript? (11/8/2007 3:35:45)

I doubt email address like "someone"@domain.com is valid even though that site validates this entry. For a start, I am unable to create an email account with special characters like double quotes and spaces. Second, when I attempt to send email to this type of email address, I am prompted that that is invalid.

I am pretty sure no email addresses can associate with IP address in the second part after the @ sign.

Perhaps that article is talking about another planet.



MartynB -> RE: Please can you help with this Javascript? (11/8/2007 7:14:28)

Hi William...

I'm sure that you are probably correct.

I entered the question, what is a valid email address into Yahoo and that page referred to came up.

Clearly there must be a source of information that defines the answer to the question and I'd like to develop my JavaScript skills with the practical exercise of developing a module that anyone can use since millions of websites must enable the user to divulge their web address.

Since I don't know whether a source of information is correct or not I have to take the information in good faith. I'm never surprised to discover that there is something else I don't know because I've only been in this game for 35 years and never does a day pass without me finding out something else I didn't know or that I was wrong about something that I thought I knew [sm=BangHead.gif].

Such is the nature of the beast with which we work!



Page: [1]

Valid CSS!




Forum Software © ASPPlayground.NET Advanced Edition 2.4.5 ANSI
0.125