bing_15007 2017-09-11 08:36 采纳率: 25%
浏览 1863

angularjs1.x修改如何获取checkbox选中的那条数据以弹窗展现?初学请多多指教

<div ng-controller="checkController">
<div class="list-operation">
    <p>
        <button type="button" class="btn btn-info btn-sm" ng-click="Modify()"><span class="glyphicon glyphicon-edit"></span>修改</button>             
        <button type="button" class="btn btn-danger btn-sm" ng-click="batchIds()"><span class="glyphicon glyphicon-floppy-remove"></span>删除</button>                
    </p>
</div>
<table class="table table-bordered">
  <thead>
    <tr>
      <th width="3%"><input type="checkbox" ng-model="selectAll" ng-checked="select" ng-click="changeAll()"></th>
      <th>名称</th>
      <th>电话</th>
      <th>是否</th>
    </tr>
  </thead>
  <tbody>
    <tr ng-repeat="user in users">
      <td><input type="checkbox" ng-checked="selectAll" ng-click="funcChange()" ng-model="user.isSelected"/></td>
      <td>{{user.username}}</td>
      <td>{{user.tel}}</td>
      <td>{{user.Shuttle}}</td>
    </tr>
  </tbody>
</table>
</div>
<div class="modal fade" id="Modify" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static">
    <div class="modal-dialog" style="width:800px;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">修改</h4>
            </div>
            <div class="modal-body">
                            <input type="text" value="名称"/>
                            <input type="text" value="电话"/>
                            <input type="text" value="是否"/>
                    </div>
                 </div>
    </div>
</div>
JS:
    myApp.controller('checkController', function($scope,$http,$location) {
        $http.get('lib/data/data.json').success(function(response) {
            var arr = [];
            var data = response.data;
            for(var i=0;i<data.length;i++){

            }
            data.forEach(function(val,index){
                var arrdata = val;
                arrdata.Shuttle = arrdata.Shuttle =='1'?'是':'否';
                arr.push(arrdata)
            })
            $scope.users = arr
        })

        //修改
        $scope.Modify=function(){
            $('#Modify').modal('show');

        }


        $scope.selectAll=false;//全选默认为false

   //全选按钮check的点击事件
      $scope.changeAll = function(){//全选/取消全选  
        angular.forEach($scope.users,function(v,k){  
          v.isSelected = $scope.selectAll;  
        })  
      }; 
    //单个数据的check事件
      $scope.funcChange = function(){// 当所有都选中时  
        $scope.select = true;  
        angular.forEach($scope.users,function(v,k){  
          $scope.select = $scope.select && v.isSelected;  
        });  
      };
    });
  • 写回答

1条回答 默认 最新

  • devmiao 2017-09-11 15:50
    关注
    评论

报告相同问题?

悬赏问题

  • ¥15 C#读写EXCEL文件,不同编译
  • ¥15 如何提取csv文件中需要的列,将其整合为一篇完整文档,并进行jieba分词(语言-python)
  • ¥15 MapReduce结果输出到HBase,一直连接不上MySQL
  • ¥15 扩散模型sd.webui使用时报错“Nonetype”
  • ¥15 stm32流水灯+呼吸灯+外部中断按键
  • ¥15 将二维数组,按照假设的规定,如0/1/0 == "4",把对应列位置写成一个字符并打印输出该字符
  • ¥15 NX MCD仿真与博途通讯不了啥情况
  • ¥15 win11家庭中文版安装docker遇到Hyper-V启用失败解决办法整理
  • ¥15 gradio的web端页面格式不对的问题
  • ¥15 求大家看看Nonce如何配置