[英]Checkbox check/uncheck not working properly with angularjs
我正在开发一个项目,我在 ASP.NET MVC 中使用局部视图,在该局部视图中有一个 html 表,在表 header 中,单击该复选框时有一个复选框,除了表体数据外,所有复选框都应该是选中,如果从表体数据中取消选中任何复选框,则顶部 header 复选框也应取消选中。 此功能适用于我当前的代码,但如果我取消选中顶部 header 复选框并再次选中它并尝试取消选中任何表体数据复选框顶部 header 复选框未取消选中我无法弄清楚为什么这是行不通的
这是我的代码
<table class="table table-condensed table-bordered table-hover left" style="width:100%;margin:0px;">
<thead>
<tr>
<th>
<input type="checkbox" style="margin: 3px 0;" ng-model="IsAllChecked" ng-change="CheckUncheckAll(IsAllChecked)" ng-checked="isChecked"/>
</th>
<th><label>Name</label></th>
<th><label>City</label></th>
<th><label>Country</label></th>
</tr>
</thead>
<tr ng-repeat="clientData in $Clients.Clients| orderBy:'Name'|limitTo: totalDisplayed | filter: searchClient"
ng-mouseover="MouseOverOnUnassigned(clientData );" ng-mouseleave="MouseLeaveOnUnassigned(clientData)">
<td>
<input type="checkbox" ng-model="clientData.IsSelectedClients" ng-change="CheckUncheckHeader(clientData.IsSelectedClients)" />
</td>
<td>{{clientData.Client}}</td>
<td>{{clientData.City}}</td>
<td>{{clientData.Country}}</td>
</tr>
</table>
还有我的 angular js 代码
$scope.CheckUncheckHeader = function (checked) {
$scope.isChecked = true;
for (var i = 0; i < $scope.$Client.Clients.length; i++) {
if (!$scope.$Client.Clients[i].IsSelectedClients) {
$scope.isChecked = false;
break;
}
};
};
$scope.CheckUncheckAll = function (IsAllChecked) {
for (var i = 0; i < $scope.$Client.Clients.length; i++) {
$scope.$Client.Clients[i].IsSelectedClients= IsAllChecked;
}
};
任何人都可以告诉什么是实现这一目标而不会失败的最佳方法。 提前致谢
请尝试使用以下代码。 祝你好运
$scope.CheckUncheckAll = function (IsAllChecked) {
for (var i = 0; i < $scope.$Client.Clients.length; i++) {
if(IsAllChecked == true)
{
$scope.$Client.Clients[i].IsSelectedClients= true;
$scope.isChecked = true;
} else
{
$scope.$Client.Clients[i].IsSelectedClients= false;
$scope.isChecked = false;
}
}
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.