当用户选择其中一个嵌套复选框但我的脚本无效时,我想让提交按钮处于活动状态。
HTML
<div ng-controller="new_report_ctrl" class="list">
<form id="report" name="report" method="post">
<label class="item item-input item-stacked-label">
<ion-list ng-repeat="item in accounts">
<ion-checkbox ng-model="account_number">{{item.account_number}}</ion-checkbox>
</ion-list>
<label class="item item-input item-stacked-label">
<span class="input-label">Report</span>
<input type="text" ng-model="user_report" placeholder="Please enter your report here" required>
</label>
<br />
<p align="center"><button ng-disabled="!isChecked()" class="button button-positive" ng-click="report()" >Submit</button></p>
</form>
</div>
JS
$scope.customer_name=localStorage.getItem("customer_name");
$scope.username=localStorage.getItem("username");
$http.get('http://localhost/myapp/templates/user/accounts.php?username='+$scope.username).success
(function(data){
$scope.accounts=data;
console.log(JSON.stringify(data));
});
$scope.isChecked=function(){
return ($scope.account_number)
}
当我不使用ng-repeat时,脚本可以正常工作
答案 0 :(得分:4)
有一个有效的例子..您需要检查所有复选框值,而不仅仅是最后一个。
var app = angular.module("app",[]);
app.controller("ctrl", function($scope){
$scope.customer_name="customer_name";
$scope.username="username";
$scope.accounts = [];
for( var i = 0; i < 10; i++)
{
$scope.accounts.push({account_number:(100+i),isChecked:false })
}
$scope.isChecked=function()
{
for( var i = 0; i < $scope.accounts.length; i++)
{
if($scope.accounts[i].isChecked == true)
return true;
}
return false;
}
})
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body ng-app="app" ng-controller="ctrl" >
<div class="list">
<form id="report" name="report" method="post">
<label class="item item-input item-stacked-label">
<ul>
<li ng-repeat="item in accounts">
<input type="checkbox" ng-model="item.isChecked">{{item.account_number}}</ion-checkbox>
</li>
</ul>
<label class="item item-input item-stacked-label">
<span class="input-label">Report</span>
<input type="text" ng-model="user_report" placeholder="Please enter your report here" required>
</label>
<br />
<p align="center"><button ng-disabled="!isChecked()" class="button button-positive" ng-click="report()" >Submit</button></p>
</form>
</div>
</body>
</html>