0

表单验证在 Firefox 中运行良好,但在 Internet Explorer 9 中失败。

我为动态生成的必填字段使用了这个 span 标签来验证空字段。

<span ng-show="hasError('"+fieldName+"', 'required')"></span>

$scope.hasError= function(field, validation){
        if(validation){
          return ('$scope.myForm.field.$dirty' && '$scope.myForm.field.$error[validation]') || ($scope.submitted && '$scope.myForm.field.$error[validation]');
        }
        return ('$scope.myForm.field.$dirty' && '$scope.myForm.field.$invalid') || ($scope.submitted && '$scope.myForm.field.$invalid');
    };

最初我有

$scope.hasError = function(field, validation){
    if(validation){
      return ($scope.myForm[field].$dirty && $scope.myForm[field].$error[validation]) || ($scope.submitted && $scope.myForm[field].$error[validation]);
    }
    return ($scope.myForm[field].$dirty && $scope.myForm[field].$invalid) || ($scope.submitted && $scope.myForm[field].$invalid);
};

这给了我

TypeError:无法获取属性“$dirty”的值:对象为空或未定义

在 IE9 控制台中,将其更改为上面发布的代码后,TypeError 消失了,但文本框周围的红色边框仍然没有出现在 IE9 中,以提醒用户有空字段。

应该针对 IE9 执行哪些操作才能验证空字段?

或者有没有其他方法可以验证在 Firefox 和 IE 中动态生成的表单字段?

4

2 回答 2

1

我知道确保表单验证的最佳方法是检查表单在提交时是否有效。

按照表单开发人员指南,创建一个名为 update 的函数。然后在保存之前添加一个检查以查看表单是否有效:

$scope.update = function(user) {
    if (!$scope.myformname.$valid) return false;
    $scope.master = angular.copy(user);
};

其他重要步骤是将这个新的更新功能连接到提交按钮:

<form ng-submit="update(user)" name="myformname" novalidate>

在我看来,在表单无效时禁用提交按钮:

<input type="submit" ng-disabled="!myformname.$valid" value="Save" />

请看下面的例子。我包括了两种不同风格的显示错误消息。

于 2015-09-25T19:07:36.123 回答
0

我认为应该是 $scope.myForm.field.$error.dirty

于 2016-10-13T11:02:24.867 回答