angularjs 二级联动 并且动态添加select下拉框

在这里插入图片描述

代码:

<div class="form-group"  id="img2">
            <p class="accordion-inner">
            <p class="alert alert-info fade in" ng-repeat="permission in permissions">
                <label class="col-sm-2 control-label">可见部门</label>
                <select  ng-model="permission.grantee"  class="grantees  sls"  name="department"  id="major"
                         ng-options=" item.departmentId as item.departmentName for item in dertList" ng-change="dertListMap(permission.grantee)">
                    <option value="">请选择</option>
                </select>
                <select class="grantees sls" name="id" id="position"
                        ng-options="option.departmentId as option.departmentName for option in dertListss[permission.grantee]"
                        ng-model="permission.port1">
                </select>
                <button class="btn" type="button" ng-click="delPermission($index)">删除</button>

            </p>
            <p>
                <div class="xinz">
                    <button class="btn" style="margin-top: 7px" type="button" ng-click="addPermission($index)">增加</button>
                </div>
            </p>

            <br>

            </p>
        </div>

js:

//部门
        $scope.items = [];    //初始化数组,以便为每一个ng-model分配一个对象
        var i = 0;
        $scope.getResult = function () {      //计算输入框的总值
            var result = 0;
            angular.forEach($scope.items, function (item, key) {
                result += parseInt($scope.items[key]);
            });
            $scope.result = result;
            console.log($scope.result)
        };

        $scope.Fn = {
            add: function () {         //每次添加都要给items数组的长度加一
                $scope.items[i] = 0;
                i++;
            },
            del: function (key) {      //每次删除一个输入框都后要让i自减,否则重新添加时会出bug
                console.log(key);
                $scope.items.splice(key, 1);
                i--;
                $scope.getResult();    //每次删除时得重新计算总值
            }
        };
//增加许可访问p
        $scope.permissions = [{grantee: "", port1: "", port2: "", port3: ""}];
        $scope.addPermission = function ($index) {
          $scope.permissions.splice($index + 1, 0, {grantee: "", port1: "", port2: "", port3: ""});
           // $scope.permissions.splice($scope.permissions.length + 1, 0, {grantee: "", port1: "", port2: "", port3: ""});
            console.log($scope.permissions);


        };


//删除许可访问p

        $scope.delPermission = function ($index) {

            $scope.permissions.splice($index, 1);

        };

        $scope.listCityByProvince=function(selected1){
            var data = {
                departmentId:selected1?selected1:"",
            };
            $http.post($scope.prefix + 'getDepartment', data)
                    .success(function (response) {
                        $scope.dertList=response.data;

                    }).error(function () {
            });
        };
        $scope.dertListss={}
        $scope.dertListMap=function(department){
          //  console.log(department)
            var data = {
                departmentId:department
            };
            $http.post($scope.prefix + 'getDepartment', data)
                    .success(function (response) {
                        $scope.dertListss[department]=response.data;

                    }).error(function () {
            });
        };

  /* 保存 */
        $scope.save = function () {
            var objs = $scope.permissions;
            console.log(objs);
            $scope.departmentIds=[];
            angular.forEach(objs, function(data){
                // console.log(data.grantee);
                $scope.departmentIds.push(data.port1);
                console.log( $scope.departmentIds)
            });
            var fd = toFormData($scope.formData);
            fd.append("file",document.getElementById('iconFile').files[0]);
            fd.append("departmentIds",  $scope.departmentIds);
            console.log(fd)
         //   if(valid()) {
                new ShowDlog().prompt({
                    icon:"waitting",
                    msg:"正在保存...",
                    done:function(){},
                    t:60*1000
                });
                $http({
                    method:"post",
                    url:$scope.prefix + 'addFlash',
                    data:fd,
                    headers:{"Content-Type": undefined},
                    transformRequest:angular.identity
                }).success(function (data) {
                    $dlog.close();
                    if ("200" == data.code) {
                        new ShowDlog().prompt({
                            icon:"success",
                            msg:"保存成功!",
                            done:function(){
                                $scope.cancel();
                            },
                            t:1500
                        });
                    } else {
                    }
                }).
                error(function () {
                })
        //    }
        };

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值