How to call form validator for specific form before form submit

0 votes
asked Aug 3, 2014 in javascript library by Rick

I am using form-validator.js to do validations on my webpages. I have multiple forms on my screen and I am using jquery ajax to post the form. I was calling jQuery.validate() to validate the form. But this is calling validations for all the forms in the page. But I need to do validation only to a specific form.

<form id="form1" method="POST" action="webpageurl">
    <div class="input-group">
        <span class="input-group-addon">FirstName</span>
        <div>
            <input type="text" name="firstname" class="form-control" data-validation="required" data-validation-error-msg="FirstName required">
        </div>
    </div>

    <div class="input-group">
        <span class="input-group-addon">LastName</span>
        <div>
            <input type="text" name="lastname" class="form-control" data-validation="required" data-validation-error-msg="LastName required">
        </div>
    </div>
    <input name="save_form1" value="Save Form1" title="" type="submit" class="qa-form-tall-button qa-form-tall-button-save">
</form>

<form id="form2" method="POST" action="webpageurl">
    <div class="input-group">
        <span class="input-group-addon">Address Line</span>
        <div>
            <input type="text" name="addressline" class="form-control" data-validation="required" data-validation-error-msg="Address Line required">
        </div>
    </div>

    <div class="input-group">
        <span class="input-group-addon">Address Line 2</span>
        <div>
            <input type="text" name="city" class="form-control" data-validation="required" data-validation-error-msg="City required">
        </div>
    </div>
    <input name="save_form2" value="Save Form2" title="" type="submit" class="qa-form-tall-button qa-form-tall-button-save">
</form>
Share

1 Answer

0 votes
answered Aug 3, 2014 by Aadhira (1,213 points)
selected Aug 3, 2014 by administrator
 
Best answer

form-validation.js has form property to specify the specific form which you want to validate. You can pass the id of that form so that, it will validate only that specific form. Once the form is validated and everything is success, then form validator will call onSuccess method. So, inside that method you can write your ajax call to submit your form to the respective server side url. Below code can help you resolve the issue.

jQuery.validate({
    form: '#form1',
    onSuccess: function() {
        submitForm1();
        return false;
    }
});

var submitForm1 = function()
{
    var $form = jQuery('#form1'), url = $form.attr('action').val();
    jQuery.post(
            url,
            {formdata: $form.serialize()},
    function(data)
    {
        var result = jQuery.parseJSON(data);
        //do more with the result
    });
}

Your answer

Preview

Your name to display (optional):
Privacy: Your email address will only be used for sending these notifications.
Anti-spam verification:
To avoid this verification in future, please log in or register.
site design / logo / content © 2013 - 2015 pinfaq.com
...