tp5调用父栏目数据使用bootstrap展示栏目树形结构
未知
2021-06-03 17:29:42
0
问题描述:

实现一个下图的树形结构栏目。


解决办法:
html代码:


          {volist name="list" id="vo"}

                   //第一个tr展示父栏目
                        <tr>
                            <td onclick="loadSon(this,'catalog{$vo.id}')">
                                <span  class="  glyphicon glyphicon-plus" aria-hidden="true"></span>
                            </td>
                            <td>{$vo.typename}</td>                        

                            <td>
                                <a href="__URL__/addSonType/parent_id/{$vo.id}/channel_type/{$vo.channel_type}" class="btn btn-primary btn-sm">增加子栏目</a>                            
                            </td>
                        </tr>

             //如果父栏目下有子栏目就循环显示。getsub是放在common.php中的公共函数,调用父栏目ID下的所有子栏目

                        {eq name="$vo.is_exist" value="1"}
                            {volist name="$vo.id|getsub" id="vos"}
                            <tr  class="catalog{$vo.id} cataloghide">
                                <td></td>
                                <td>{$vos.typename}</td>                            

                                <td>
                                    <a href="__URL__/editType/id/{$vos.id}" class="btn btn-primary btn-sm">修改</a>
                                </td>
                            </tr>
                            {/volist}
                        {else/}
                        {/eq}
                    {/volist}

<script type="text/javascript">

        function loadSon(e,biao){

            console.log(biao);

            if($("."+biao).css('display')=='none'){

                $("."+biao).addClass('catalogshow');

                $("."+biao).removeClass('cataloghide');

                $(e).find('span').removeClass('glyphicon-plus').addClass('glyphicon-minus');

            }else{

                $("."+biao).addClass('cataloghide');

                $("."+biao).removeClass('catalogshow');

                $(e).find('span').addClass('glyphicon-plus').removeClass('glyphicon-minus');

            }

        }

</script>

控制器中的方法:

// 加载文章栏目列表页面

    public function indexType(){

        //从数据库获取顶级栏目数据

        $mm=Db::name('arctype')->where('parent_id',0)->order('id','asc')->paginate(15);

        $mm_all=$mm->all();//获取数组

        foreach ($mm_all as $k=> &$value) {
            //判断当着顶级栏目有没有子栏目,

            $subcatalog=Db::name('arctype')->where('parent_id',$value['id'])->select();
            $value['is_exist']=0;//没有子栏目
            if($subcatalog){
                $value['is_exist']=1;//有子栏目

            }
            $mm[$k]=$value;

        }        

        //分配变量

        $this->assign(["list"=>$mm]);

        return view();

    }

相关内容

MySQL变量的作用域与访...
摘要: MySQL变量具有作用域和访问控制,局部变量限于特定上下...
2024-11-20 20:00:40
MySQL变量类型列表
MySQL变量类型包括数值、字符串、日期和时间等类型,用于存储不同...
2024-11-20 19:46:45
MySQL变量数据类型介绍
MySQL支持多种数据类型,包括数值、字符串、日期时间及枚举和集合...
2024-11-20 19:23:39
如何使用MySQL变量进行...
本文详细介绍了MySQL中用户定义变量、系统变量和局部变量的使用方...
2024-11-20 18:46:45
动态分配MySQL变量的示...
MySQL中,变量用于存储临时数据,包括全局和会话变量以及用户定义...
2024-11-20 18:23:38
MySQL变量存储的数据类...
MySQL支持多种数据类型以存储不同种类的变量,包括数值型、字符串...
2024-11-20 18:00:48

热门资讯

tp5 jquery判断手机端... application--common.php中添加如下代码 //函数作用是判断用户打开的是手机端还...
Laravel 5.5 .No... 创建了新的laravel项目后, 运行提示:No application encryption ke...
php 打印date函数出现错... 问题描述: 我使用的是phpstudy,在练习时间函数的时候,打印出现在的时间,date(Y-m-d...
生成随机字符唯一标识符guid... /** * @param $length * @return string * 生成随机字符串 */...
layui缩略图 div class=layui-form-item label class=layui-form-l...
php函数substr_rep... php函数substr_replace从某个位置替换或删除或插入字符串
Laravel 引入自定义类库... 强烈建议引入的类 都是含有命名空间的,这样使用起来就不会出现重名的情况。!!当然,没有命名空间也可以...
object json转化为数... //调用api 程序,通知商户订单异常 20200314 public function callt...
Laravel 查看SQL操作... 方法一:临时打印操作记录 DB::connection()-enableQueryLog(); # ...
php银行开放平台接口:pfx... 问题描述: 对接易通银行,他们的服务开放平台是java开发,而我的是php,现在需要php版本的SD...