good day!

I have a php form. I have made some ajax validation on it but everytime i click the submit button it does not validate, and when I try to issue an alert command on ajax function, it returns undefined on certain variables?

Here is my present code:
<Form codes>

               <form method="POST" id="newsletter-form" name="newsletter-form" onSubmit="return doSubmit();">
                    <p>
                         <label for="name">Your name</label>
                         <input type="text" name="name" id="name" value="" tabindex="1" />
                    </p>
                    <p>
                         <label for="email">Your email address</label>
                         <input type="text" name="email" id="email" value="" tabindex="2" />
                    </p>
                    <p>
                        We hate spammers!<br />
                        <input type="submit" value="Join Us" />
                    </p>
                </form>

<Ajax validation codes>

function doSubmit(){    
        var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
        var name  = $('newsletter-form [name="name"]').val();  
        var email_address = $('newsletter-form [name="email"]').val();

        if(name == ""){
            alert("Please enter your name.");
            return false;
        }

        if(email_address == ""){
            alert("Your email is required.");
            return false;
        }
};

Thanks for helping..!

Recommended Answers

All 2 Replies

Missing hash on the front of your form's ID

function doSubmit(){    
        var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
        var name  = $('#newsletter-form [name="name"]').val();  
        var email_address = $('#newsletter-form [name="email"]').val();
        if(name == ""){
            alert("Please enter your name.");
            return false;
        }
        if(email_address == ""){
            alert("Your email is required.");
            return false;
        }
}

Also, if I can make a suggestion for a cleaner method

$("#newsletter-form").submit(function(){
    var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
    var name  = $('#newsletter-form [name="name"]').val();
    var email_address = $('#newsletter-form [name="email"]').val();

    if(name == ""){
        alert("Please enter your name.");
        return false;
    }
    if(email_address == ""){
        alert("Your email is required.");
        return false;
    }
});

Using this, you can remove the onSubmit="return doSubmit();" from your form tag.

thank you pixelsoul!

I've made a slight modification and it works! Code below!

$(document).ready(function() {
    $('#submit-form').click(function(){
    var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
    var name = $('#newsletter-form [name="name"]').val();
    var email_address = $('#newsletter-form [name="email"]').val();

    if(name == ""){
    alert("Please enter your name.");
    return false;
    }

    if(email_address == ""){
    alert("Your email is required.");
    return false;
    }else if(reg.test(email_address) == false){
    alert("Invalid Email Address.");
    return false;
    }
    });
});
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.