Question

我的bootstrap验证器有问题，我有一个angularjs项目，我在一个指令的模态中有一个表单。所以，我想在模态隐藏时，将表单重置为验证器重置。但是当我使用时：

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

什么都没发生，当我回想起我的表格模式时，验证器总是在这里。（输入是绿色（好）或红色（不好）。

见我的指示：

angular.module('app.administration').directive('wcStandardForm',['servicesHTTP', function(servicesHTTP)
{
return {
    restrict: 'E',
    scope: {
        standard: '=',
        method: '&'
    },
    replace: true,
    templateUrl: 'app/administration/directives/standard/wc-standard-form.tpl.html',
    link: function(scope, form)
    {
        form.bootstrapValidator({
            framework: 'bootstrap',
            excluded: ':disabled',
            feedbackIcons: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {
                name: {
                    validators: {
                        notEmpty: {
                            message: 'le nom est nécessaire.'
                        },
                        stringLength: {
                            max: 31,
                            message: 'Le nom ne doit pas dépasser 31 caractères.'
                        }
                    }
                }
            }
        });
    },
    controller: function($scope)
    {

        /**
         * Vide le moduleForm
         */
        $scope.clearStandardForm = function()
        {
            //$scope.standard = {};
            $('#StandardForm').bootstrapValidator('resetForm', true);
        };

        /**
         * Valide le module et envoi la requete http
         */
        $scope.validateStandardForm = function()
        {
            ...
            $scope.clearStandardForm();
        };
    }
};
}]);

这里是模板：

<div class="modal fade" id="standardFormModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                    <span aria-hidden="true" ng-click="clearStandardForm()">&times;</span>
                    <span  ng-click="clearStandardForm()" class="sr-only">Close</span>
                </button>
                <h4 class="modal-title">Assigner fonctions</h4>
            </div>
            <div class="modal-body">
                <form id="StandardForm" method="post" class="ng-pristine ng-valid bv-form" novalidate="novalidate">
                    <button type="submit" class="bv-hidden-submit" style="display: none; width: 0px; height: 0px;"></button>

                    <div class="form-group">
                        <label class="control-label">Nom</label>
                        <input type="text" class="form-control" name="name" ng-model="standard.standard_name">
                    </div>

                    <div class="form-actions">
                        <div class="row">
                            <div class="col-md-12">
                                <button type="button" class="btn btn-default" data-dismiss="modal" ng-click="clearStandardForm()">Close</button>
                                <button type="submit" class="btn btn-primary"data-dismiss="modal" ng-click="validateStandardForm()"><i class="fa fa-save"></i> Sauvegarder</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

我尝试在模式和事件的事件$('#StandardForm').bootstrapValidator('resetForm', true); et show.bs.modal上执行hidden.bs.modal。

所以如果你有一个想法，我会接受它：）

Answer 1

查看您的代码，发现了这个错误id="StandardF orm"（如果它不是拼写错误）

<form id="StandardF orm" method="post" class="ng-pristine ng-valid bv-form" novalidate="novalidate">

JS中使用的选择器是$('#StandardForm')

其次，如果您查看参考here，则重置具有验证规则的表单字段的替代方法是$(form).data('bootstrapValidator').resetForm();

$('#StandardForm').data('bootstrapValidator').resetForm(true);

bootstrap验证器不想重置

1 个答案: