Question

我正在使用带有CodeIgniter的Eclipse。我正在尝试创建一个按this one之类的字母分组的A-Z搜索页，但是我无法使用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;
}

Answer 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 -->

希望这可以回答您的问题。

Answer 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魔术来根据您的要求制作

如何创建A-Z列表

2 个答案: