thinkphp + layui 三级联动

后端：

// 添加数据
    public function add(){
        // 查询分类数据
        $category = \app\admin\model\Category::where('pid',0)->select();
        // 渲染到页面
        return view('add',compact('category'));
    }
    // 三级联动 查询数据
    public function getPid($pid){
        $data = \app\admin\model\Category::where('pid',$pid)->select();
        return json(['code'=>0,'msg'=>'查询成功','data'=>$data]);
    }

前台表单：

<div class="layui-form-item">
        <label class="layui-form-label">三级联动商品分类</label>
        <div class="layui-input-inline">
            <select name="" lay-filter="cate_one" id="cate_one">
                <option value="0">请选择一级分类</option>
                {foreach($category as $v)}
                    <option value="{$v.id}">{$v.cate_name}</option>
                {/foreach}
            </select>
        </div>
        <div class="layui-input-inline">
            <select name="" lay-filter="cate_two" id="cate_two">
                <option value="">请选择二级分类</option>
            </select>
        </div>
        <div class="layui-input-inline">
            <select name="cate_name" lay-filter="cate_three" id="cate_three">
                <option value="">请选择三级分类</option>
            </select>
        </div>
        <div class="layui-form-mid layui-word-aux">请选择商品分类</div>
    </div>

layui部分

<script>

    //Demo
    layui.use(['form','jquery'], function(){
        var form = layui.form;
        var $ = layui.jquery;

        // 三级分类
        form.on('select(cate_one)',function (data) {
            var pid = data.value;
            console.log(pid);
            $.ajax({
                url:'getPid',
                data:{pid:pid},
                success:function (e) {
                    $("#cate_three").empty()
                    $item ='<option value="">请选择</option>'
                    $(e.data).each(function (k,v) {
                        $item +=' <option value="'+v.id+'">'+v.cate_name+'</option>'
                    })
                    $('#cate_two').html($item);
                    form.render();
                }
            })
        });
        // 三级分类
        form.on('select(cate_two)',function (data) {
            var pid = data.value;
            console.log(pid);
            $.ajax({
                url:'getPid',
                data:{pid:pid},
                success:function (e) {
                    // $("#cate_three").empty()
                    $item ='<option value="">请选择</option>'
                    $(e.data).each(function (k,v) {
                        $item +=' <option value="'+v.id+'">'+v.cate_name+'</option>'
                    })
                    $('#cate_three').html($item);
                    form.render();
                }
            })
        });
    });
</script>

记得应用layui的css和js