Validation js对javascript的验证_Validation_Angularjs

Validation js对javascript的验证

validation angularjs

Validation js对javascript的验证,validation,angularjs,Validation,Angularjs,目前，这是我的代码： <!doctype html> <html ng-app="validation-example"> <head> <script src="http://code.angularjs.org/1.0.6/angular.min.js"></script> <link href="http://docs.angularjs.org/css/bootstrap.min.css" rel="sty

目前，这是我的代码：

<!doctype html>
<html ng-app="validation-example">
<head>
    <script src="http://code.angularjs.org/1.0.6/angular.min.js"></script>
    <link href="http://docs.angularjs.org/css/bootstrap.min.css" rel="stylesheet" />
    <link href="http://docs.angularjs.org/css/font-awesome.css" rel="stylesheet" />
    <link href="http://docs.angularjs.org/css/docs.css" rel="stylesheet" />
    <link href="StyleSheet.css" rel="stylesheet" />

    <script src="script.js"></script>
</head>
<body style="background-color: teal">
    <link href="StyleSheet.css" rel="stylesheet" />

    <div ng-controller="Controller">
        <form name="form" class="css-form" novalidate>
            Float:        
          <input type="text" ng-model="length" name="length" smart-float />
            {{length}}<br />
            <span ng-show="form.length.$error.float">This is not a valid float number!</span>
            <br />
            <button ng-click="submit()"
                ng-disabled="form.$invalid">
                Submit</button>
        </form>
    </div>
</body>
</html>

当浮动无效时，我禁用了按钮。但是，我希望始终启用submit按钮，并在服务器上的函数中检查表单是否无效，并向用户弹出一个警报，提示提交被中断，因为我们有无效数据。当应用类绑定时，我可以使用“form.$invalid”，但是如果为了允许无效提交而删除它，那么函数中的if（form.$invalid）是未定义的。如果表单中有无效输入，如何签入控制器？我可以遍历元素并检查ng无效css类，但这是最愚蠢的。因此，请建议一个智能解决方案。

表单的所有错误都设置为

$scope.formName.$error

对象。我刚刚使用Chrome的开发者工具检查了该对象的属性集，发现该对象根据错误类型在不同的数组中保存所有验证错误。下面的屏幕截图将为您提供更好的想法：

我用来检查这一点的示例代码在

您需要遍历这些属性并生成要在弹出窗口中显示的错误消息。

请尝试

$scope.form.$invalid

。

var app = angular.module('validation-example', []);

function Controller($scope) {
    $scope.master = {};

    $scope.reset = function () {
        $scope.user = angular.copy($scope.master);
    };   

    $scope.reset();

    $scope.submit = function () {
        debugger;
        if (form.$invalid)
        {
            alert("sss");
        }
    };
}

var FLOAT_REGEXP = /^\d+((\.|\,)\d+)?$/;
app.directive('smartFloat', function () {
    return {
        require: 'ngModel',
        link: function (scope, elm, attrs, ctrl) {
            ctrl.$parsers.unshift(function (viewValue) {
                if (FLOAT_REGEXP.test(viewValue)) {
                    ctrl.$setValidity('float', true);
                    return parseFloat(viewValue.replace(',', '.'));
                } else {
                    ctrl.$setValidity('float', false);
                    return undefined;
                }
            });
        }
    };
});