Search code examples
javascriptfunctionvalidationemail-validationxhtml-1.0-strict

Validating form data in Javascript xhtml 1.0 strict, not considering server side scripts for this instance


There are other questions regarding validating email addresses with javascript. There are also questions regarding validating forms. However I cannot get my code to work, and cannot find a question to cover this particular issue.

Edit

I totally understand that in a live website, server side validation is vital. I also understand the value of sending email confirmation. (I actually have a site that has all these features). I know how to code spam checks in php.

In this instance I have been asked to validate the email input field. I have to conform to xhtml 1.0 strict, so cannot use the type "email", and I am not allowed to use server side scripts for this assignment. I cannot organise email confirmation, it has to be totally checked via javascript.

I hope this clarifies my question

I am trying to validate a form for two things.

To check that all fields have data. To see if a valid email address is entered.

I am able to validate a form fields for data, but trying to incorporate the email check is a trouble for me.

It was giving alerts before, but incorrectly, now it is not being called at all (or at least that is how it is behaving).

Once I get this working I then need to focus on checking if the email addresses match. However this is an issue outside of this question.

I am only focused on validating this in javascript. I am not concerned about server side in this particular instance (another issue outside of this question). Thanks.

function Validate()
        {
            var inputs = [document.getElementById('fname'),_
 document.getElementById('lname'), document.getElementById('email1'),_
 document.getElementById('email2')];

            for(var i = 0; i<inputs.length; i++)
            {
                if(inputs[i].value == '')
                {
                   alert('Please complete all required fields.');
                    return false;
                    }

                    else if ((id =='email1' || 'email2') &&_
(inputs[i].value!= /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/ )){
                        alert('Please enter a valid email address.');
                        return false;
                    }
            }
         }


<form onsubmit="return Validate()"  action="" method="post"  id="contactForm" >
 <input  type="text"  name="fname" id="fname"  />

 <input  type="text"  name="lname" id="lname" />

 <input   type="text"  name="email1"  id="email1" />

 <input   type="text"  name="email2"  id="email2"/>

 <input type="submit" value="submit" name="submit"  />
</form>

A side note - to format text that wraps, is it ok (for the purposes of posting a question, to add and underscore and create a new line for readability? In the actual text I have it doesn't have this! Please advise if there is a simpler way to format my code for posts. Thanks again.

Edit 2

It works when I comment out this:

/*else if ((id =='email1' || id=='email2') && (inputs[i].value!= /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/ )){
    alert('Please enter a valid email address.');
        return false;
}*/

So this helps with the trouble shooting.


Solution

  • I already see a syntax error there :

    else if ((id =='email1' || 'email2') 
    

    should be

    else if ((id =='email1' || id=='email2') 
    

    from where I see it.

    Note also that entering a space in any field will also pass through the test : you should trim your field values when testing for empty ones.

    finally, concerning validating the email, this is not how you use regex. Please read this post for a demonstration on how to validate an email in javascript+regex.