7

使用 angularjs 进行表单验证我想在用户单击提交时将所有必填字段标记为错误。

我正在使用 input.ng-dirty.ng-invalid 设置错误控件的样式。所以我想要的是在用户提交表单时在所需控件(或所有控件..对我来说都是一样的)上设置 ng-dirty。

验证正在工作。我理解为什么,我正在尝试的可能是错误的,但我发现没有其他方法可以达到同样的效果,除了我认为太复杂而无法正确的事情。

我尝试的是:

<div ng-app>
    <form novalidate>
        <input name="formvalue" type="text" ng-model="formvalue" required />
        <input type="submit" />
    </form>
</div>

http://jsfiddle.net/yq4NG/

4

1 回答 1

8

让我们首先将 Angular 添加到您的 jsfiddle 中

<div ng-app>...</div>

http://jsfiddle.net/yq4NG/1/

默认情况下,必填字段将在输入(脏)时进行验证。如果您希望在提交任何输入(原始)之前验证它们,那么您可以在您的提交按钮上运行一个函数,该函数将检查原始字段并弄脏它们。

这就是我在示例中所做的:http: //jsfiddle.net/yq4NG/6/

您可能可以使用自定义格式化程序和验证器构建可重用的解决方案,但这是一个简单的开关解决方案。

编辑:

再次使用类更简单:http: //jsfiddle.net/yq4NG/8/

编辑 [正如@XMLilley 在评论中所建议的]:

因为Angular没有提供$setDirty()等效于$setPristine()我们通过简单地用. 它没有任何改变,而是模拟用户手动输入每个字段并在不更改任何内容的情况下弄乱值。$dirty$modelValue$pristine

于 2013-08-20T00:13:21.733 回答