我有一个由 Bootstrap 设计的 Angular 表单,其中包含必填字段。提交并重置表单后,将出现 HTML5 验证工具提示,指示必填字段:
我发现这非常不一致,因为如果该字段以任何其他方式聚焦于空状态,则不会出现工具提示。
重置表单后如何隐藏工具提示?
这是一个正在运行的 Plunker
表格:
<form class="form-horizontal" name="testForm">
<div class="form-group">
<label class="col-sm-2 control-label" for="current-input">Input:</label>
<div class="col-sm-10">
<div class="input-group">
<input name="current-input" class="form-control" ng-model="current_input" required />
<span class="input-group-btn"><button class="btn btn-primary" type="submit" ng-click="check()">Check</button></span>
</div>
</div>
</div>
</form>
Controller :
$scope.check = function() {
$scope.testForm.$setPristine();
$scope.testForm.$setUntouched();
$scope.last_input = $scope.current_input;
$scope.current_input = ""
}
最佳答案
只需添加 ng-submit 并设置检查函数,而不是通过 onclick 调用检查,因为您已经指定按钮类型提交,如下所示:
<form class="form-horizontal" name="testForm" ng-submit="check()">
……
<span class="input-group-btn"><button class="btn btn-primary" type="submit" >Check</button></span>
然后就可以了
干杯
关于javascript - 表单重置后,Angular-Bootstrap 不显示验证工具提示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36451247/