Question

I’m trying to use jQuery validate to validate a form and handle the form submission but can’t seem to get the syntax correct and cannot find an example like mine in the API. My code is below:

$("#beta_form").validate({
    rules: {   
        p_emailaddress: {
            required: true,
            email :true
        } 
    }
    submitHandler : function() {
        $.ajax({
            type:'POST',
            url :'websiteUrlWithService',
            data: $('#beta_form').serialize(),
            complete: function() { 
                $('#dialog').jqmHide();
                $('#formSubmissionThanks').jqmShow();               
            }               
        });
    }
});     

The form HTML is as follows:

    <form class="login_form" id="beta_form" name="beta_form">

            <label for="p_name" class="login_label">Name:</label>
            <input type="hidden" id="p_enquiry" name="p_enquiry" value="Beta Enquiry" />
            <input type="text" id="p_name" name="p_name" class="login_input" value="" />
             <br />
            <br/>
            <label for="emailaddress" class="login_label">Email Address:</label>
            <input type="text" id="p_emailaddress" name="p_emailaddress" class="login_input" value="" />
            <br />
            <br/>
            <label for="role" class="login_label">Current Role:</label>
            <select size="1" id="p_role" name="p_role">  
                  <option value="1">None Selected</option>
                  <option value="2">Recruiter</option>
                  <option value="3">HR Role</option>
                  <option value="4">Self Employed</option>

                </select>
            <br/>
            <br/>
            <label for="terms" class="login_label">Include me in the Beta testing selection?</label>

            <input type="checkbox" id="p_terms" name="p_terms" class="boxes login_label"/>
            <br />
            <br/>
            <input type="submit" id="submitbuttonbeta" class="login_submitbutton" value="Submit" />
            </form>

When I run this with Firebug on it suggests that I’m missing a } after the submitHandler property list but as far as I can see the syntax is correct. This error is preventing my form from firing altogether.

Any suggestions?

Answer 1

You were missing comma

$("#beta_form").validate({
       rules: {   
         p_emailaddress: {
            required: true,
            email :true
         } 
        },
       submitHandler : function() {
        $.ajax({
            type:'POST',
            url :'websiteUrlWithService',
            data: $('#beta_form').serialize(),
            complete: function() { 
                $('#dialog').jqmHide();
                    $('#formSubmissionThanks').jqmShow();               
                }               
        });

       }
    });