Preventing submission after jQuery Validation Engine

Question

Once clicking button, wanting to prevent submission to local storage if any required fields are not filled out. Both functions work properly. Just trying to prevent LocalStorage.save() from hitting if $("#formID").validationEngine(); finds a required field not completed.

<form id="formID" name="myForm">    

 <input class="validate[required]" type="text" id="agree" name="agree"/>         
 <button type="submit" value="Save" id="Save" onclick="clicked();">Submit Survey</button>

</form>

<script type="text/javascript">   
  function clicked() {
        if (confirm('Are you sure you want to submit?')) {

           $("#formID").validationEngine();               
           my.LocalStorage.save();

        } else {
            return false;
        }
    }
 </script>  

Answer 1

From their documentation at http://posabsolute.github.io/jQuery-Validation-Engine/:

validate

Validates a form or field, displays error prompts accordingly.
Returns true if the form validates, false if it contains errors.

It is inversed for fields, it return false on validate and true on errors.

When using form validation with ajax, it returns undefined, the result is delivered asynchronously via function options.onAjaxFormComplete.

// form validation 
alert( $("#formID1").validationEngine('validate') );

// field validation 
alert( $("#emailInput").validationEngine('validate') );

So that would change your code to:

function clicked (e) 
{
    if ( confirm('Are you sure you want to submit?') ) 
       if ( $("#formID").validationEngine('validate') )
           my.LocalStorage.save();

    e.preventDefault();  
}

Take note that I added e as a parameter that needs event passed in via:

<button type="submit" value="Save" id="Save" onclick="clicked(event);">
    Submit Survey
</button>