如何创建 A-Z 列表答案

【问题标题】：How to create A-Z listing如何创建 A-Z 列表
【发布时间】：2019-09-09 09:45:13
【问题描述】：

我正在使用带有 CodeIgniter 的 Eclipse。我正在尝试创建一个按字母组合的 A-Z 搜索页面，例如 this one，但我无法使用 CodeIgniter 来实现。

型号：

public function listarLojas() {
    $this->db->order_by("nome_loja", "ASC");
    return $this->db->get("lojas")->result_array();
}

控制器：

$dados['lojas'] = $this->lojas_model->listarLojas();

查看：

（这是我的问题，我无法让foreach 出现在示例链接中：https://www.cuponomia.com.br/desconto）

https://codepen.io/anon/pen/vMjLNz

HTML：

<div class="row" >
  <div class="col mt-3">
    <h5 class="text-muted pb-3 fonte-helvetica">Our main stores in alphabetical order</h5>
    <div class="card card-personalizada">
      <h6 class="card-header crd-hr-custom border-bottom-0 text-center bg-primary text-light">
        1 2 3 4 5 6 7 8 9 A B C D E F G H I J K L M N O P Q R S T U V W Y X Z
      </h6>
      <div class="card-body crd-bdy-custom">
        <!-- column -->
        <div class="row">
          <div class="col-lg-1">
            <span class="font30">A</span>
          </div>
          <div class="col-lg-11">
            <div class="container">
              <ul class="list-unstyled row">
                <li class="list-item col-md-3"> Test </li>
              </ul>
            </div>
          </div>
        </div>
        <!-- column -->
        <hr>
      </div>
    </div>
    <?php 
      include 'buscar_lojas.php';
    ?>
  </div>
</div>

CSS：

body {
  background-color: #a3d5d3;
}

【问题讨论】：

因为你这里没有足够的代码可以使用，而且这不是一个代码编写服务，我建议你谷歌以下例子：“az pagination codeigniter”然后回来当你有一个更具体的问题而不是一个宽泛的“你能为我完成 90% 的问题”时。

标签： php codeigniter foreach

【解决方案1】：

你需要给字母加上锚标记，这将链接到它需要指向的容器的 id。

<h6 class="card-header crd-hr-custom border-bottom-0 text-center bg-primary text-light">
        1 2 3 4 5 6 7 8 9 <a href="#A">A</a> B C D E F G H I J K L M N O P Q R S T U V W Y X Z
      </h6>

然后根据字母给每一列分配id。

    <!-- column -->
    <div class="row" id="A">
      <div class="col-lg-1">
        <span class="font30">A</span>
      </div>
      <div class="col-lg-11">
        <div class="container">
          <ul class="list-unstyled row">
            <li class="list-item col-md-3"> Test </li>
          </ul>
        </div>
      </div>
    </div>
    <!-- column -->

希望这能回答你的问题。

【讨论】：

【解决方案2】：

这样试试

$lastChar = '';
foreach ($dados['lojas'] as $row){
    $char2 = str_split($row->name); 
    $char = $char2[0];
    if ($char !== $lastChar) {
        if(empty($last_char)){
            $skill_data .= '<li><h3>'.strtoupper($char).'</h3></li>';
        }
        $lastChar = $char;
    }
    $skill_data .= '<li>'.$row->name.'</li>';
}

看起来像这样

<li>A</li>
   <li>About Home</li>
   <li>Absolut Leather</li>
   <li>A Esportiva</li>
   ...
<li>B</li>
   <li>B2 Smile</li>
   <li>Balaroti</li>
   <li>Barceló Hotels & Resorts</li>
....

假设$row->name 是从对象数组中获取的类别名称

注意：- CSS 魔法将需要根据您的要求制作

【讨论】：