三级联动(商品)

157 阅读1分钟

1、在后台获取到分类或者其他的数据,然后传到前台,在前台判断pid=0的为顶级分类(后台也可以,在后台做事最好的);

<div class="form-group">
  <label >一级</label>
  <select class="form-control one" >
    <option>请选择</option>
    {foreach($data as $v)}
      {if($v['pid']==0)}
        <option value="{$v['id']}">{$v['cate_name']}</option>
      {/if}
    {/foreach}
  </select>
</div>

 2、获取到前台的数据id后,然后与后台数据的pid进行比较是否相同,如果相同,那么就是一级的子级然后再进行json转换

 $pid = \request()->param('pid');
        if (empty($pid)){
            return json(['code'=>500,'msg'=>'id错误']);
        }
        $data = collection(Category::where('pid',$pid)->select())->toArray();
        $res = (new Category())->where('pid',$pid)->select();
        return json(['code'=>200,'msg'=>'ok','data'=>$res]);

 3、前台替换(三级依次操作)

    //商品分类三级联动
    $('#cate_one').change(function(){
        var pid = $(this).val();
        $.ajax({
            'url':"{:url('category/getSubCateByPid')}",
            'type':'post',
            'data':{'pid':pid},
            'dataType':'json',
            'success':function(response){
                if(response.code != 10000){
                    alert(response.msg);return;
                }
                var str = '<option value="">请选择二级分类</option>';
                $.each(response.data, function(i,v){
                    str += '<option value="' + v.id + '">' + v.cate_name + '</option>';
                });
                $('#cate_two').html(str);
            }
        });
    });

 (可能有没有加注释不宜理解,有时间后再进行完善)