Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

MVC bypass client-side validation ("save progress" vs "submit")

I have a form that I want to be able to save without validating, but validates on submit. I've got two buttons on this form to either save or submit.

The problem is: if I use a "submit" button to save (and then do a switch on which action in the controller), jquery.validate kicks in and I can't save a partially-filled out form.

If I do it as a link, I don't know how to make the form post to the new action in the controller.

Here's the HTML from the view:

<a class="btn  btn-default" data-placement="right" data-title="Save your progress." href="/Summary/Save/2" rel="tooltip"><i class="glyphicon glyphicon-floppy-disk"></i> Save Summary</a> 
<a class="btn  btn-default" confirm="Are you sure you want to revert to the previous saved copy? You will lose all changes since your last save." data-placement="right" data-title="Revert back to your last saved copy." href="/Summary/Revert/2" rel="tooltip"><i class="glyphicon glyphicon-remove"></i> Revert Changes</a> 
<button class="btn-default  btn btn-primary" confirm="This will submit the summary to the evaluator for review. No changes will be allowed unless the evaluator returns it. Are you sure?" type="submit">Submit Summary</button>
like image 720
pennstatephil Avatar asked Dec 16 '22 02:12

pennstatephil


2 Answers

BTW, the current answer is deprecated according to the docs on Skipping validation on submit:

To skip validation while still using a submit-button, add the attribute "formnovalidate" to that input:

<input type="submit" name="go" value="Submit">
<input type="submit" formnovalidate name="cancel" value="Cancel">

This used to work by adding class="cancel" to the input, this is now deprecated.

Although, as of version 1.17, both methods still appear in the source code:

...blob/1.17.0/src/core.js#L34:

// Allow suppressing validation by adding a cancel class to the submit button
if ( $( this ).hasClass( "cancel" ) ) {
    validator.cancelSubmit = true;
}

// Allow suppressing validation by adding the html5 formnovalidate attribute to the submit button
if ( $( this ).attr( "formnovalidate" ) !== undefined ) {
    validator.cancelSubmit = true;
}

Further Reading: jQuery Validation plugin: disable validation for specified submit buttons

like image 181
KyleMit Avatar answered Feb 23 '23 03:02

KyleMit


@user2864740 suggested I temporarily disable jquery validation, which is a good idea-- found a way to do that at jQuery Validation plugin: disable validation for specified submit buttons

Answer posted for convenience:

You can add a css class of cancel to a submit button to suppress the validation

e.g

<input class="cancel" type="submit" value="Save" />
like image 39
pennstatephil Avatar answered Feb 23 '23 02:02

pennstatephil