Ajax验证没有请求发送到服务器

I apologize for opening what might be a very basic post, I am learning Ajax please keep that in mind.

I have a simple registration form.

What im trying to do

• validate the form
• if all is in order register new user

I have managed to get the Ajax script to register a new user but my problem comes in with the validation part hench im turning here for a bit of help and advice

HTML

 <div id="regResponse">
 </div>
 <form class="form-horizontal" id="regForm" role="form" method="post" action="../register.php" >
     <div class="form-group">
         <label class="control-label col-sm-2" for="regName">Name:</label>
         <div class="col-sm-10">
             <input type="text" name="regName" class="form-control" id="name" placeholder="">
         </div>
     </div>
     <div class="form-group">
         <label class="control-label col-sm-2" for="regLastName">Surname:</label>
         <div class="col-sm-10">          
             <input type="text" name="regLastname" class="form-control" id="lastname" placeholder="">
         </div>
     </div>
     <div class="form-group">
         <label class="control-label col-sm-2" for="regEmail">Email:</label>
         <div class="col-sm-10">          
             <input type="text" name="regEmail" class="form-control" id="regEmail" placeholder="">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-sm-2" for="regPword">Pword:</label>
        <div class="col-sm-10">          
            <input type="text" name="regPword" class="form-control" id="regPword" placeholder="">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-sm-2" for="confRegPword">Confirm Pword:</label>
        <div class="col-sm-10">          
            <input type="text" name="confRegPword" class="form-control" id="regPword2" placeholder="">
        </div>

JQUERY AJAX

function sendForm() {
    var valid;
    valid = validateContact()
    if(valid){
        // Get the form.
        var form = $('#regForm');
        // Get the messages div.
        var formMessages = $('#regResponse');
        // Set up an event listener for the contact form.
        $(form).submit(function(e) {
            // Stop the browser from submitting the form.
            e.preventDefault();
            // Serialize the form data.
            var formData = $(form).serialize();
            // Submit the form using AJAX.
            $.ajax({
                type: 'POST',
                url: $(form).attr('action'),
                data: formData
            })
            .done(function(response) {
                // Make sure that the formMessages div has the 'success' class.
                $(formMessages).removeClass('error').addClass('success');
                // Set the message text.
                $(formMessages).html(response); // < html();
                // Clear the form.
                $('').val('')
            })
            .fail(function(data) {
                // Make sure that the formMessages div has the 'error' class.
                $(formMessages).removeClass('success').addClass('error');
                // Set the message text.
                var messageHtml = data.responseText !== '' ? data.responseText : 'Oops! An error occured and your message could not be sent.';
                $(formMessages).html(messageHtml); // < html()
            });
        });
    }
}

function validateContact(){
    var valid = true;
    var name = document.getElementById("name").value;
    var lastname = document.getElementById("lastname").value;
    var email = document.getElementById("regEmail").value;  
    if(name ==''){
        document.getElementById("name").style.borderColor="red";
        name.value="Please Enter Name";
        valid = false;  
    }
    if(lastname ==''){
        valid = false;  
    }
    if(email ==''){
        valid = false;  
    }
    return valid;
}

PHP

if ($_SERVER["REQUEST_METHOD"] == "POST") {
    //get variables from reg form
    $name = $_POST['regName'];
    $lastName = $_POST['regLastname'];
    $email = $_POST['regEmail'];
    :
    $sql ="INSERT INTO members......."
    ($result = mysql_query($sql) or trigger_error(mysql_error()."in".$sql);
    if($result){
        echo '<h3 style="blue">Registration Succesesfull</h3>'; 
    }
    else{
        echo '<h3 style="blue">OOPS...Something went wrong here</h3>';  
    }   
}//request POST method

Like I said as form the registration part all is working but as soon as I added the JavaScript validation the whole script stopped working. My biggest problem is that my browser is not showing me any errors so I dont know where I am going wrong

Any help will be much appreciated

I think you need to add a button in your html and call function sendForm() on that button's click event.

Your sendForm function is not triggered. Code below as your reference, is the right way to trigger submit event via jquery.

jQuery

$(function() {
    $('form').submit(function(e) {
        e.preventDefault();
        var valid;
        valid = validateContact()
        if(valid ) {
            $.ajax({
                type: 'POST',
                url: "http://facebook.com",
                data: {},
                dataType: 'json',
                success: function() {
                    alert('success');
                },
                error: function() {
                    alert('error');
                }
            })
        }
    });
});


function validateContact(){
    var valid = true;
    var name = document.getElementById("name").value;
    var lastname = document.getElementById("lastname").value;
    var email = document.getElementById("regEmail").value;  
    if(name ==''){
        document.getElementById("name").style.borderColor="red";
        name.value="Please Enter Name";
    valid = false;  
    }
    if(lastname ==''){
    valid = false;  
    }
    if(email ==''){
    valid = false;  
    }
    return valid;
}