Dar*_*geL 22 javascript forms form-editing angularjs
我试图通过写一些字段来检查我的表单是否正在编辑.我读过$ dirty应该为这个任务工作,但我无法弄清楚我在这里缺少什么:
<!DOCTYPE html>
<html lang="en">
<script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="formCtrl">
<form name = "myForm" novalidate>
First Name:<br>
<input type="text" ng-model="user.firstName"><br>
Last Name:<br>
<input type="text" ng-model="user.lastName">
<br><br>
<button ng-click="reset()">RESET</button>
</form>
<p> is Form dirty? {{isDirty}}<p>
<p>form = {{user }}</p>
<p>master = {{master}}</p>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('formCtrl', function($scope) {
$scope.master = {firstName:"John", lastName:"Doe"};
$scope.reset = function() {
$scope.user = angular.copy($scope.master);
};
$scope.reset();
$scope.isDirty = $scope.myForm.$dirty;
});
</script>
</body>
</html>
我试图在用户修改表单时将标志isDirty设为true.谢谢
Pan*_*kar 35
您缺少name表单字段中的属性,这些属性无法为这些字段启用表单验证.您需要为每个字段添加唯一名称,以便在myForm对象中添加这些字段
标记
<form name="myForm" novalidate>
First Name:<br>
<input type="text" name="firstName" ng-model="user.firstName"><br>
Last Name:<br>
<input type="text" name="lastName" ng-model="user.lastName">
<br><br>
<button ng-click="reset()">RESET</button>
</form>
你也正在访问myForm只是表单对象的对象,在DOM被渲染之前我将无法使用,$scope.myForm在控制器启动时只是未定义,如果你真的想$scope.myForm从控制器访问那么你需要将代码放入$timeout这将$timeout在下一个摘要周期中运行功能代码.
$timeout(function(){
$scope.isDirty = $scope.myForm.$dirty;
});
更新
不需要维护单独的 isDirty标志(这将需要更改单独的isDirty标志以反映标志中的任何更改myForm.$dirty.)相反,我建议您$scope.myForm.$dirty 直接使用标志.所以使用表达式myForm.$dirty,这个标志会随着表单变脏而改变.
| 归档时间： |
|
| 查看次数： |
46444 次 |
| 最近记录： |