JQUERY: PREVENT FORM SUBMIT ON AJAX VALIDATION ERROR

Goti Bandu

Total Post:119

Points:835
Posted by  Goti Bandu
AJAX 
 2752  View(s)
Ratings:
Rate this:

Hi MindStickians!

I have a form with some ajax validation fields.(not all fields are validated using ajax)

I want to prevent form submit if there is an error on one of those fields.

I would like it to be generic for other forms I have with ajax validation.

1 flag would not do the trick.

This is what the ajax field looks like on error:

<label id="id_name_lab" class="error">name</label>
<input id="id_name" type="text" maxlength="128" name="name">
<label id="id_name_succ_icn" class="icon_succ" style="display: none;"></label>
<label id="id_name_load_icn" class="icon_load" style="display: none;"></label>

Thanks in advance!

  1. AVADHESH PATEL

    Post:604

    Points:4228
    Re: jquery: prevent form submit on ajax validation error

    Hi Goti!


    you can try this way

    $("form").one( "submit", function() {
        var self = this;
        // ajax validation
        $.ajax()
            .done( function() {
                // call validation, if form is valid, ajaxValidation calls submit again.
                ajaxValidation( self );
            });

        // first submit is always ignored.

    e.preventDefault();

    return false;

    }); 

    function ajaxValidation( target ) {

        // check valid & call submit

    }

Answer

NEWSLETTER

Enter your email address here always to be updated. We promise not to spam!