Thinkphp 分级联动

补充：

1、thinkphp中，视图和控制器的关联，要求视图和控制器的函数名相同。

2、在视图控制器中使用如下代码

    $role=D(self::$ROLE_MODEL)->get();

    $this->assign（'role'，$role）;

    $this->display();

代表在模板可以使用$role来遍历表role的记录。

 

正文：

创建管理员时，会选择部门。每一级部门标好层数，选择好顶层部门，会生成下一个子级的下拉框。修改父级时，所有下层下拉框又清空，并删除下下级的下拉框。

如下代码表示初步生成顶级部门的下拉框。联动部分生成或删除的下拉框将在js中实现。

//设置下拉框的attr_value，记录层数

<div class="form-group rem" attr_value='1' >
                            <label class="col-sm-2 control-label">部门：</label>
                            <div class="col-sm-8">
                                    <select class="form-control department"  >
                                        <option value =""></option>
                                    <?php foreach ($department as $key => $value) {?>
                                      <option value ="<?php echo $value['id'];?>">
                                      <?php echo $value['name'];?>
                                      </option>
                                    <?php } ?>
                                    </select>

                            </div>

</div>

 

以下是js中的联动功能。当下拉框的勾选值发生变化，要做删除下下级下拉框，（选择子级时）增加层数，获取选到的id，传给控制器（省略），控制器再调用model里的获取子级的函数（省略）。返回子级后在页面的ajax里循环添加子级列表。

$(document).on('change','.department',function(){

            //获取到变动的下拉框

            var that=$(this)

            //获取父级的父级，取到attr_value

            var attr_value=that.parent().parent('.form-group').attr('attr_value');
            //console.log(attr_value);

           

            //删除下下级的

            $(".rem").each(function(){
                attrvalue=$(this).attr("attr_value");
                // console.log(attrvalue);
                if (attrvalue>attr_value) {
                    $(this).remove();
                };

            });

            //获取当前的部门id

            var department_id=$(this).val();
            attr_value++;
            $.ajax({
                url:'/Department/get_do',
                data:{
                    "department_id":department_id
                },
                type:'post',
                dataType:"json",
                success:function(data){
                    if(data.status){
                        if (data.results) {
                           var html_de='<div class="form-group rem" attr_value='+attr_value+'><label class="col-sm-2 control-label"></label><div class="col-sm-8"><select class="form-control department"><option value ="0">请选择</option>';
                            for (var i = 0; i < data.results.length; i++) {
                                html_de+='<option value ="'+data.results[i].id+'">'+data.results[i].name+'</option>'
                            }
                            html_de+='</select></div></div>';
                            that.parent().parent('.form-group').after(html_de);
                        }
                    }else{
                        
                    }
                },
            });
        })
    })