...

View Full Version : Form Validation - but not in a pop-up window?



thecodemeist3r
06-16-2008, 02:37 PM
I have read through tutorials where they have form validation that validates when the clicks "submit" button.

What I am needing is, the form being validated in real time. It seems un-usual i know, but I have seen it somewhere, I cant remember where though.

What I mean is:
http://img171.imageshack.us/img171/1121/copyofregistrationcopyvz9.jpg (http://imageshack.us)
http://img171.imageshack.us/img171/1121/copyofregistrationcopyvz9.af0b54abae.jpg (http://g.imageshack.us/g.php?h=171&i=copyofregistrationcopyvz9.jpg)

Where, in realtime, the form is constantly validating, so after the user inputs his email wrong in the second box, on the side, it tells the user, you emails are different as shown.

Thanks for looking, and as always, any help would be much appreciated.

**I am writing this form validation in JavaScript - clientside.

**I am however looking at learning and moving this site to asp.net, so if I cant do this with JavaScript, client-side, could I do this with asp.net?

Philip M
06-16-2008, 04:07 PM
In fact validation as the user fills in the form is very common.

Here is an example of what you want:-


<form name = "myform">
Enter your email address <input type = "text" name = "email1" id = "email1" size = 30><br>
Confirm your email address <input type = "text" name = "email2" id = "email2" size = 30 onblur = "chkEmail()">
<span style = "color:FF0000; font-size:10pt" name = "warning" id = "warning"</span>
<br><br>
</form>

<script type = "text/javascript">
function chkEmail() {
document.getElementById("warning").innerHTML = "";
var em1 = document.getElementById("email1").value;
var em2 = document.getElementById("email2").value;
if (em1 != em2) {
document.getElementById("warning").innerHTML = " The two email addresses do not match. Try again!";
document.getElementById("email1").value = "";
document.getElementById("email2").value = "";
document.getElementById("email1").focus();
return false;
}
if (!(/^([a-z0-9])([\w\.\-\+])+([a-z0-9])\@(([\w\-]?)+\.)+([a-z]{2,4})$/i.test(em1))) { // invalid email address
document.getElementById("warning").innerHTML = " The email address is not valid! Try again!";
document.getElementById("email1").value = "";
document.getElementById("email2").value = "";
document.getElementById("email1").focus();
return false;
}
alert ("Email addresses match and are valid "); // delete this line after testing
}
</script>


Remember that JavaScript form validation only provides convenience for users, not security. This means that JavaScript should be used as an "enhancement", not as a requirement. So your form should not be dependent on JavaScript alone to perform your validation. Instead, whatever server-side language you use to process the form (PERL, ASP, PHP, etc.) should also perform the same validation. Otherwise, people will be able to bypass your validation simply by disabling JavaScript.



All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.

thecodemeist3r
06-17-2008, 02:16 AM
Thanks for the script.

I have also read that form validation should both use client side and and server side validation for that very reason, however, I, at this point in time, do not know any server side languages unfortunately.

Dondon
06-17-2008, 04:53 AM
http://tetlaw.id.au/view/javascript/really-easy-field-validation

Just follow the instructions.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum