ECSHOP：首页实现显示子分类商品，并实现点击Tab页切换分类商品

2021-11-13 23:43:56

例子：首页实现显示子分类商品，并实现点击Tab页切换分类商品（非AJAX）

开始：

1. 打开调试开关

文件地址：include/cls_template.php 找到：

 function _eval($content)

函数体第一行增加: echo($content);

改写调试完毕后在注释掉。

2. 修改goods获取函数，以便显示子分类。

文件：include/cls_goods.php 找到函数：function assign_cat_goods,

在 $cat['id'] = $cat_id; 后增加一行:

$cat['cat_id'] = get_child_tree($cat_id);

// 调用子分类信息。

3.修改模板 cat_goods.lbi ，显示子分类并调用子商品

<div class="row" style="margin-top:15px;" id="CatGoods">
<div class="span12">
    <div class="tabbable" style="position:relative;">
         //有子分类
      <ul class="nav nav-tabs" >
         //显示子分类
        <li class="active" ><a href="#tab{$rec_cat.id}" data-toggle="tab">{$rec_cat.name|escape:html}</a></li>
        

      </ul>

      <div class="tab-content">

//这里循环获取当前商品分类ID，传入获取商品信息集合
       <?php
               $cid = $this->_var['rec_cat1']['id'];
            $this ->assign('goods_cat_'.$cid, assign_cat_goods($cid, 4));
            $this->assign('cat_goods_nf',$this->_var['cat_goods_'.$cid]);
     ?>
        <div class="tab-pane active" id="tab{$rec_cat1.id}">
          <div class="row">
             //显示商品
            <div class="span3">
              <div class="thumbnail"> <a href="{$goods.url}"><img src="{$goods.thumb}" alt="{$goods.name|escape:html}"></a>
                <div class="thumspan">{$goods.short_name|escape:html}<br />
                市场价：<span style="color:#C30"> <b>{$goods.market_price}</b></span></div>
              </div>
            </div>
            
          </div>
        </div>
        
      </div>
       //单个分类，无下级分类
      <ul class="nav nav-tabs" >
        <li class="active"><a href="#tab{$goods_cat.id}" data-toggle="tab">{$goods_cat.name|escape:html}</a></li>
      </ul>
      <div align="right" class="more"><a href="{$goods_cat.url}">更多>></a></div>
      <div class="tab-content">
        <div class="tab-pane active" id="tab{$goods_cat.id}">
          <div class="row">
            
            <div class="span3">
              <div class="thumbnail"> <a href="{$goods.url}"><img src="{$goods.thumb}" alt="{$goods.name|escape:html}"></a>
                <div class="thumspan">{$goods.short_name|escape:html}<br />
                  市场价：<span style="color:#C30"> <b>{$goods.market_price}</b></span></div>
              </div>
            </div>
            

          </div>
        </div>
      </div>
      

    </div>
</div>
</div>
<script type="text/javascript">divheight("CatGoods");</script>

效果如下：

在实际使用中，发现两个bug：

1.后台未设置显示大类时，会出现空白分类。

2.当存在两个大类显示的时候，第二个大类子分类显示的都是第一个大类的最后一个分类的内容。

改正如下：

1. 增加当前大分类ID是否有值的判断

增加位置：商品分类模板第一行cat_goods.lbi

代码：

<!--   {if not is_null($goods_cat.id) || $goods_cat.id>0}   -->

2. 修改获取当前ID代码。代码如下：

      <!--   {foreach from=$goods_cat.cat_id item=rec_cat1 name=f1 key=curCat}-->

//这里循环获取当前商品分类ID，传入获取商品信息集合

       <?php

               $cid = $this->_var['curCat'];  //改为这个

            $this ->assign('goods_cat_'.$cid, assign_cat_goods($cid, 4)); //4表示每个分类显示的商品数量，根据实际情况自己修改

            $this->assign('cat_goods_nf',$this->_var['cat_goods_'.$cid]);

     ?>

注意：这里的foreach中的key表示集合中的键值，也可以说是主键，一般是集合的ID

码农公寓

相关文章