用layui做二级，三级，多级联动表单

TIP：作者这里以二级联动为例

HTML代码

tip:代码是PHP动态渲染的

 

                        
                            *选择部门
                        
                        

                            
                                请选择服务部门
                                {volist name='ac_list' id='vo'}
                                {eq name="$vo.id" value="$ac_id"}
                                {$vo.class_name}
                                {else/}
                                {$vo.class_name}
                                {/eq}
                                {/volist} 
                            
                        
                    


                    

                        
                            *选择人员
                        
                        

                            
                                请选择服务人员
                                {volist name='au_list' id='vo'}
                                {$vo.name}
                                {/volist} 
                            
                        
                    

JS代码：

              //监听select选择
                form.on('select(admin_class_id)', function(data){ 
                //发异步
                $.get("/index/service_staff/read/ac_id/"+data.value,function(data,status){
                    console.log("数据: " + data.length + "\n状态: " + status);
                    console.log(data);
                    //清空下拉框
                    $("#admin_user_id").empty();  
                    $("#admin_user_id").prepend("--请选择服务人员--");

                        for(var i = 0; i < data.length; i++)
                        {  
                            $("#admin_user_id").append(""+data[i].name+"");
                        }
                        console.log("刷新select选择框渲染");
                        form.render('select'); //刷新select选择框渲染
                });
              
                console.log("get调用完毕");
                });  

PHP 异步请求代码

   /**
     *选择部门后，发起异步get请求
     *
     * @param  int  $id
     * @return \think\Response
     */
    public function read($ac_id)
    {
        //获取admin_user表数据
        $au_list=AdminUserModel::all(function($query)use($ac_id){
        $query->where('admin_class_id','=',$ac_id)
        ->order('id','DESC')
        ->field('id,name');
        });

        return json($au_list);

    }

 延伸阅读:

JQuery对 Select 的各种操作,所有代码作者亲测

https://blog.csdn.net/cplvfx/article/details/83928150 

 

用layui修改表单select值后没有变，没有反应，解决方案

https://blog.csdn.net/cplvfx/article/details/83932022