zoukankan      html  css  js  c++  java
  • Angularjs:实现全选

    html:

    <div class="input-group">
      <span class="input-group-addon" style="background-color: #fff;border:none">状态</span>
      <div ng-model="queryParam.status" class="ui-checkbox ui-checkbox-primary" style="margin-top: 4px;margin-bottom: 0;">
        <label class="ui-checkbox-inline">
          <input type="checkbox" ng-model="all" ng-change="selectAll()">
            <span>全部</span>
        </label>
        <label class="ui-checkbox-inline" ng-repeat = "x in List">
          <input type="checkbox" ng-model="x.checked" ng-change="selectOne()">
          <span>{{x.name}}</span>
        </label>
      </div> </div>

    js:

    $scope.checked = [];
    $scope.selectAll = function () {
      if($scope.all) {
        $scope.checked = [];
        angular.forEach($scope.List, function (i) {
          i.checked = true;
          $scope.checked.push(i.value);
        })
      }else {
        angular.forEach($scope.List, function (i) {
          i.checked = false;
          $scope.checked = [];
        })
      }
    };
    
    $scope.selectOne = function () {
      angular.forEach($scope.List , function (i) {
        var index = $scope.checked.indexOf(i.value);
        if(i.checked && index === -1) {
          $scope.checked.push(i.value);
        } else if (!i.checked && index !== -1){
          $scope.checked.splice(index, 1);
        };
      })
      if ($scope.List.length === $scope.checked.length) {
        $scope.all = true;
      } else {
        $scope.all = false;
      }
    };
  • 相关阅读:
    jQuery Deferred和Promise的使用介绍:
    asp.net客户端IP跟踪
    jquery常用的一些方法
    前端音频流播放
    c# Http请求下载二进制流文件
    iView表格行验证问题
    【已解决】Https请求—未能创建 SSL/TLS 安全通道
    安全开发规范
    数据库设计规范
    高性能开发规范
  • 原文地址:https://www.cnblogs.com/koto/p/6290049.html
Copyright © 2011-2022 走看看