Reset JQuery Form Validation

Question

I have used Jquery form validation on Category Form Fill-up which is pop-up by modal. When user make form blank and Hit Save; JQuery validation error is fired.

Now if user close this modal(Not page refresh) and open that modal again those errors are already there. i needs it to be cleared.

<div id="addcategory"  class="modal fade">
                    <div class="modal-dialog new-modal-dialog">
                        <div class="modal-content">
                            <!-- dialog body -->
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal">&times;</button>
                                <h4 class="modal-title">Add New Category</h4>
                            </div>
                            <?php echo form_open(base_url('admin/business/addNewCat'), array('class' => 'form_add_new_cat')); ?>
                            <div class="modal-body alert-message">
                                <div class="row">
                                    <div class="col-md-3">
                                        Category Name:
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                        <input type="text" name='add_new_catname' 
                                                                 class="add_new_catname form-control" 
                                                                 placeholder="Enter New Category Name" value="" />
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- dialog buttons -->
                            <div class="modal-footer"> 
                                <button type="submit" class="btn btn-success btn_add_new_cat">Save</button>
                                <button type="button" class="btn btn-default no" data-dismiss="modal" >Cancel</button>
                            </div>  
                            <?php echo form_close(); ?>
                        </div>
                    </div>
                </div>

How to do so?

Please provide a [mcve](http://stackoverflow.com/help/mcve) example. — Cyrbil, Aug 04 '15 at 12:30

score 1 · Answer 1 · edited May 23 '17 at 11:57

1

There is a method built in that allows you to cancel the validation errors. For your example, the code would look similar to:

$form = $('.form_add_new_cat');
$validator = $form.validate(); //init validator

$validator.resetForm();
$form.find('.control-group').removeClass('.error'); //bootstrap 3 support

Reference here

edited May 23 '17 at 11:57

Community

1
1

answered Aug 04 '15 at 13:03

Inspector Squirrel

2,548
2
27
38

score 0 · Accepted Answer · answered Aug 04 '15 at 13:06

0

I have solved by this way:

<button type="button" class="btn btn-default no" data-dismiss="modal" onclick="$('.has-error').children('p').remove('p'); $('.has-error').removeClass('has-error')">Cancel</button>

answered Aug 04 '15 at 13:06

Chintan7027

7,115
8
36
50

score 0 · Answer 3 · answered Aug 04 '15 at 13:09

0

use this --

http://jsfiddle.net/5LCSU/

it will remove all text and also validation it will work without refreshing page..

answered Aug 04 '15 at 13:09

Sorav Garg

1,116
1
9
26

This code only reset the form inputs only, It's fine; But i also remove the Error messages appends with `'.has-error'` class – Chintan7027 Aug 04 '15 at 13:12

Reset JQuery Form Validation

3 Answers3