Jump to content

Validation

k3n3t1k

By k3n3t1k
in JavaScript

Recommended Posts

k3n3t1k Newbie

k3n3t1k

Posted
Posted

I was wondering if anybody knows about a javascript code that will make sure that an HTML form is filled out and mae sure that the Email is an actual email and not just a bunch of tect, you know it needs the @ and the .If anybosy can help that would be great, thanks!k3n3t1k

Link to comment
Share on other sites
Ingolme w3schools Guru

Ingolme

Posted
Posted

I have this function to validate Emails:Put this in the <head> of the document:

function formValidate(aform,mail) {   formSubmit = 1;   atPosition = document.getElementById(mail).value.indexOf('@');   dotPosition = document.getElementById(mail).value.lastIndexOf('.');   dist = document.getElementById(mail).value.length;   domain = document.getElementById(mail).value.substr(dist-3,3);   if(document.getElementById(mail).value == "") {      formSubmit = 0;      alert("You must provide an E-mail address");   } else if (!dotPosition || !atPosition || atPosition < 1 || dotPosition < (atPosition + 3) || (dotPosition != (dist-4) && dotPosition != (dist-3)) || document.getElementById(mail).value.indexOf(" ") > -1 || parseInt(domain) >= 0 || parseInt(domain) < 0) {      formSubmit = 0;      alert("Invalid email address");   }   if (formSubmit == 1) {      document.getElementById(aform).submit();   }}

The HTML form must be like this:______________________________________<form action="mail.php" method="post" id="myForm">...<input type="text" id="email" />......<!-- Instead of <input type="submit" /> put the following: --><input type="button" value="send" onchange="formValidate('myForm','email')" /></form>______________________________________

Link to comment
Share on other sites
k3n3t1k Newbie

k3n3t1k

Posted
  • Author
Posted

Thanks, that will help alot, but i was still wondering if there was some code to validate whether or not the form has been completely filled out?

Link to comment
Share on other sites
Ingolme w3schools Guru

Ingolme

Posted
Posted

You must give each form element an ID and then add a line of code for each of them. Then you add that to the function I gave you previously.For example, here if the form and the javascript for each element:...<input type="text" id="element1" /><input type="text" id="element2" /><input type="text" id="element3" /><textarea id="element4" cols="30" rows="4"></textarea>...isIncomplete = false;if(document.getElementById("element1").value.length == 0) formSubmit = 0; isIncomplete = true;if(document.getElementById("element2").value.length == 0) formSubmit = 0; isIncomplete = true;if(document.getElementById("element3").value.length == 0) formSubmit = 0; isIncomplete = true;if(document.getElementById("element4").value.length == 0) formSubmit = 0; isIncomplete = true;if(isIncomplete) alert("You have not filled all the required form fields.");

function formValidate(aform,mail) {formSubmit = 1;/******** New part ********/isIncomplete = false;if(document.getElementById("element1").value.length == 0) formSubmit = 0; isIncomplete = true;if(document.getElementById("element2").value.length == 0) formSubmit = 0; isIncomplete = true;if(document.getElementById("element3").value.length == 0) formSubmit = 0; isIncomplete = true;if(document.getElementById("element4").value.length == 0) formSubmit = 0; isIncomplete = true;if(isIncomplete) alert("You have not filled all the required form fields.");/************************/atPosition = document.getElementById(mail).value.indexOf('@');dotPosition = document.getElementById(mail).value.lastIndexOf('.');dist = document.getElementById(mail).value.length;domain = document.getElementById(mail).value.substr(dist-3,3);if(document.getElementById(mail).value == "") {formSubmit = 0;alert("You must provide an E-mail address");} else if (!dotPosition || !atPosition || atPosition < 1 || dotPosition < (atPosition + 3) || (dotPosition != (dist-4) && dotPosition != (dist-3)) || document.getElementById(mail).value.indexOf(" ") > -1 || parseInt(domain) >= 0 || parseInt(domain) < 0) {formSubmit = 0;alert("Invalid email address");}if (formSubmit == 1) {document.getElementById(aform).submit();}}

Link to comment
Share on other sites
justsomeguy w3schools Guru

justsomeguy

Posted
Posted

It would be better to use a regular expression to check the format instead of checking for the positions of the characters. That function will say this is a valid address:[]@.......abcTry this one:

function check_email(src) {  var regex = /^[a-zA-Z0-9._-]+@([a-zA-Z0-9.-]+\.)+[a-zA-Z0-9.-]{2,4}$/;  return regex.test(src);}

if (!check_email(document.getElementById("email").value)) ....

Link to comment
Share on other sites
Ingolme w3schools Guru

Ingolme

Posted
Posted
It would be better to use a regular expression to check the format instead of checking for the positions of the characters. That function will say this is a valid address:[]@.......abcTry this one:
function check_email(src) {  var regex = /^[a-zA-Z0-9._-]+@([a-zA-Z0-9.-]+\.)+[a-zA-Z0-9.-]{2,4}$/;  return regex.test(src);}

if (!check_email(document.getElementById("email").value)) ....

You're right, but I never studied Regular Expressions. I should do that. The RegExp part of the Javascript reference on W3Schools is actually pretty new, I had never seen it before and I check it often. I glanced at it a week or two but never started learning it because I haven't had much time.
Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...