Monday, 9 September 2013

Javascript Button Error

Javascript Button Error

The issue I have with my JavaScript is that when I select the "Send"
button for a blank form, it tells me which fields to complete (which I
want). After selecting "OK", it asks me to "Please enter a valid email
address." in another window.
Can anyone help me with the functions and logic to eliminate this second
window if one selects "Send" without filling out the form? Do I need to
create a new function for "Entering a valid email address"?
Here's the code:
<script>
function checkforblank(){
var errormessage = "";
if (document.getElementById('fname').value ==""){
errormessage += "enter your first name \n";
}
if (document.getElementById('lname').value ==""){
errormessage += "enter your last name \n";
}
if (document.getElementById('email').value ==""){
errormessage += "enter your email \n";
}
if (document.getElementById('confirmEmail').value ==""){
errormessage += "confirm your email \n";
}
if (errormessage != ""){
alert(errormessage);
return false;
}
}
function verifyEmail(){
var status = false;
var emailRegEx = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i;
if (document.myForm.email.value.search(emailRegEx) == -1) {
alert("Please enter a valid email address.");
}
else if (document.myForm.email.value !=
document.myForm.confirmEmail.value) {
alert("Email addresses do not match. Please retype them to make
sure they are the same.");
}
else {
alert("Thank you for your interest!");
status = true;
}
return status;
}
function confirmEmailAddresses(){
checkforblank();
verifyEmail();
}
</script>
<div id="content">
<form name="myForm" action="#" method="get"
enctype="application/x-www-form-urlencoded" onsubmit="">
<table width="377" height="96">
<tr>
<td style="text-align: right">First Name:</td>
<td><label for="FirstName"></label>
<input type="text" name="fname" id="fname"></td>
</tr>
<tr>
<td style="text-align: right">Last Name:</td>
<td><label for="LastName"></label>
<input type="text" name="lname" id="lname"></td>
</tr>
<tr>
<td style="text-align: right">E-mail:</td>
<td><input type="email" name="email" id="email"></td>
</tr>
<tr>
<td style="text-align: right">Confirm E-mail:</td>
<td><input type="email" name="confirmEmail" id="confirmEmail"></td>
</tr>
</table>
<input type="submit" value="Send" onClick="confirmEmailAddresses()"><input
type="reset" value="Reset Form">
</form>
</div>
I'm fairly new to JavaScript, so please make this as easy as possible! :)
Thank you.

No comments:

Post a Comment