val no alert




JavaScript Source Code 3000: Forms: Validation (No Alert)









































Validation (No Alert)







Stop displaying those annoying alert boxes with your JavaScript form validation. This script uses images to display any error messages to the user, cool!








Enter your information:
(* denotes required field).



First Name:

*




Zip Code:

*




Phone:

-
-
*
val-no-alert.zip





JavaScript Source Code 3000: Forms: Validation (No Alert)
Simply click inside the window below, use your cursor to highlight the script, and copy (type Control-c or Apple-c) the script into a new file in your text editor (such as Note Pad or Simple Text) and save (Control-s or Apple-s). The script is yours!!!





    





<!-- TWO STEPS TO INSTALL VALIDATION (NO ALERT):

1. Copy the coding into the HEAD of your HTML document
2. Add the last code into the BODY of your HTML document -->

<!-- STEP ONE: Paste this code into the HEAD of your HTML document -->

<HEAD>

<SCRIPT LANGUAGE="JavaScript">
<!-- Original: Jeff Harding (jbh@site-ations.com) -->
<!-- Web Site: http://www.site-ations.com -->
<!-- Modified by: Ronnie T. Moore, Editor -->

<! >
<! >

<!-- Begin
// Preload images
var empty = new Image(); empty.src = "fieldempty.gif";
var email = new Image(); email.src = "emailerror.gif";
var zipcd = new Image(); zipcd.src = "ziperror.gif";
var phone = new Image(); phone.src = "phoneerror.gif";

var haveerrors = 0;
function showImage(imagename, imageurl, errors) {
document[imagename].src = imageurl;
if (!haveerrors && errors) haveerrors = errors;
}

function validateForm(f) {
haveerrors = 0;
(f.fname.value.length < 1) // validate first name length
? showImage("firstnameerror", "fieldempty.gif", true) // no semi-colon after this line!
: showImage("firstnameerror", "blankimage.gif", false); // true = errors, false = no errors

(f.lname.value.length < 1) // validate last name length
? showImage("lastnameerror", "fieldempty.gif", true)
: showImage("lastnameerror", "blankimage.gif", false);

(f.zip.value.length != 5) // validate zip code length
? showImage("ziperror", "ziperror.gif", true)
: showImage("ziperror", "blankimage.gif", false);

phonenumlength = f.area.value.length +
f.exchange.value.length + f.number.value.length;

(phonenumlength != 10) // validate phone number length
? showImage("phoneerror", "phoneerror.gif", true)
: showImage("phoneerror", "blankimage.gif", false);

(f.email.value.search("@") == -1 || f.email.value.search("[.*]") == -1) // validate email
? showImage("emailerror", "emailerror.gif", true)
: showImage("emailerror", "blankimage.gif", false);

return (!haveerrors);
}
// End -->
</script>
</HEAD>

<!-- STEP TWO: Copy this code into the BODY of your HTML document -->

<BODY>

<center>
<form action="script.cgi" name="myform" onSubmit="return validateForm(this)">
<table border=0 cellspacing=0 celpadding=0>
<tr>
<td colspan=2>Enter your information:<br>
<sup>(<font color="#ff0000">*</font> denotes required field).</sup></td>
</tr>
<tr>
<td><p align=right>
First Name:</td>
<td>
<input type=text name="fname" size=25 maxlength=50><font color="#ff0000">*</font><br>
<img name=firstnameerror src="blankimage.gif" width=350 height=10 border=0></td>
</tr>
<tr>
<td><p align=right>
Last Name:</td>
<td>
<input type=text name="lname" size=25 maxlength=50><font color="#ff0000">*</font><br>
<img name=lastnameerror src="blankimage.gif" width=350 height=10 border=0></td>
</tr>
<tr>
<td><p align=right>
Zip Code:</td>
<td>
<input type=text name=zip size=25 maxlength=50><font color="#ff0000">*</font><br>
<img name=ziperror src="blankimage.gif" width=350 height=10 border=0></td>
</tr>
<tr>
<td><p align=right>
Email:</td>
<td>
<input type=text name=email size=25 maxlength=50><font color="#ff0000">*</font><br>
<img name=emailerror src="blankimage.gif" width=350 height=10 border=0></td>
</tr>
<tr>
<td><p align=right>
Phone:</td>
<td>
<input type=text name=area size=4 maxlength=5>-
<input type=text name=exchange size=4 maxlength=3>-
<input type=text name=number size=5 maxlength=4><font color="#ff0000">*</font><br>
<img name=phoneerror src="blankimage.gif" width=350 height=10 border=0></td>
</tr>
<tr>
<td colspan=2><p align=center>
<hr>
</td>
</tr>
<tr>
<td><p align=center>
</td>
<td><p align=right>
<input type=submit value="Submit Form"></td>
</tr>
</table>
</form>
</center>



<!-- Script Size: 3.82 KB -->











Wyszukiwarka

Podobne podstrony:
No Words Alone
Eula NO
166 T S 1998 petrol NO
no art 1
No last song
No Place Like Home
Everlast Speak No Evil
alert button
val char
upgradefrom? nb NO
PERÍFRASIS VERBALES no 1
Beatles For no one
Serie 7 2003 diesel NO

więcej podobnych podstron