模态的Bootstrap验证程序不会重置Form [英] Bootstrap validator for modal doesnt reset Form

问题描述

我在模态内的表单中使用了引导验证器，该验证器保留在后续的表单访问中.例如，如果执行以下操作

I am using bootstrap validator for my form inside modal.The validator gets retained on subsequent form access. For example if the do the following operation

1. 访问表单输入一些有效值并提交表单.

2. 再次访问该表单，该字段的颜色仍保持绿色，因为我在上一个表单提交中输入了有效条目

1. Access form enter some valid value and submit the form.

2. Access the form again the color of the field still remain in green , since i entered a valid entry in my previous form submission

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
 <div class="modal-dialog">
   <div class="modal-content">
   <div class="modal-header">
     <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
    <h4 class="modal-title" id="myModalLabel">Add new Node</h4>
  </div>
   <div class="modal-body">
    <div class="modal-body">
        <form role="form" id="addNodeForm">
          <div class="form-group">
            <label for="nodename" class="control-label">Node Name</label>
            <input type="text" name="nodename" class="form-control" id="nodename" required>
          </div>

        </form>
   </div>
  <!--  <div class="alert alert-success">
        <a href="#" class="close" data-dismiss="alert">&times;</a>
        <div id="thanks"></div>
    </div> -->
 </div>
 <div class="modal-footer">
  <button type="button" id="add-close" class="btn btn-default" data-dismiss="modal">Close</button>
   <button type="button" id="add-save" class="btn btn-primary">Save changes</button>
 </div>
</div>

        $('#myModal').on('hidden.bs.modal', function(){
            $(this).removeData('bs.modal');
            $('#nodename').val("");
            $('#addNodeForm').bootstrapValidator('resetForm', true);
        });

        $('#myModal').on('show.bs.modal', function () {
             // $('#addNodeForm').bootstrapValidator('resetForm', true);
            $(this).removeData('bs.modal');
            $('#addNodeForm').bootstrapValidator('resetForm', true);
              $.ajax(
                     {
                         url: "node/getnodelist",
                         type: "GET",
                         success:function(text) 
                         {
                             alert(text);
                            nodelist = text;
                         },
                         error: function(jqXHR, textStatus, errorThrown) 
                         {
                             //if fails      
                         }
                     });
            });

        $('#addNodeForm').bootstrapValidator({
            feedbackIcons: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {
                nodename: {
                    validators: {
                        notEmpty: {
                            message: 'Function name is required'
                        }
                    }
                }
            }
        });

推荐答案

尝试以下代码:

$('#contactform').bootstrapValidator('resetForm', true);

这篇关于模态的Bootstrap验证程序不会重置Form的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！