Help completing validation check on email field

[cairns1d]

Hi, I have a details screen where visitors to the website can leave their contact info. I have some javascript rules to validate some of the fields when the visitor is filling them out so they cannot leave certain fields empty. I have an email field where aswell as stopping the visitor leaving the field blank i want a validation check so it looks for the presence of "@" and a "." within the field. But I am having trouble getting this implemented. Currently my code for the blank checks looks like this (with the email field in the last block) :-

 

</script><script language="javascript" type="text/javascript">function validate_form ( ){valid = true; if (document.networkOpportunity.contactName.value == "") { alert ( "Please enter the name of the contact for the opportunity." ); document.networkOpportunity.contactName.focus(); document.networkOpportunity.contactName.style.backgroundColor = "#d7edf8"; valid = false; } else if (document.networkOpportunity.companyName.value == "") { alert ( "Please enter the company name that the opportunity is for." ); document.networkOpportunity.contactName.style.backgroundColor = "#FFFFFF"; document.networkOpportunity.companyName.focus(); document.networkOpportunity.companyName.style.backgroundColor = "#d7edf8"; valid = false; } else if (document.networkOpportunity.serviceRequired.value == "") { alert ( "Please enter the details of the service you require." ); document.networkOpportunity.companyName.style.backgroundColor = "#FFFFFF"; document.networkOpportunity.serviceRequired.focus(); document.networkOpportunity.serviceRequired.style.backgroundColor = "#d7edf8"; valid = false; } else if (document.networkOpportunity.contactEmail.value == "") { alert ( "Please enter the email we can contact you on." ); document.networkOpportunity.serviceRequired.style.backgroundColor = "#FFFFFF"; document.networkOpportunity.contactEmail.focus(); document.networkOpportunity.contactEmail.style.backgroundColor = "#d7edf8"; valid = false; }

 

 

Any help with how to add the extra validation on the contactEmail field to look for "@" and "." will be greatly appreciated.

[dsonesuk]

This is similar topic relating to email validation. http://w3schools.invisionzone.com/index.php?showtopic=44349

 

Your code is doing a lot of duplication, I would add alert text to title of input, or use custom data attribute, then give input a required class name, then you can loop through each input with 'required' className, if these specific inputs are empty retrieve title value content and insert into alert and make required background changes, you a reducing to quarter of code compared to what you have now.

Edited August 5, 2015 by dsonesuk

[cairns1d]

Thanks for your response. I am a complete beginner here and this is code that is already in place that has been handed on to me and I am just trying to incorporate some basic validation for the email field so that user cannot submit unless an @ or . are atleast present...I have looked through the link to the other thread but I am unsure how I would represent that within what I have?