使用引导程序图标排序CakePHP表格

我想在点击它时按id排序表格。它正在工作，但最主要的是引导程序箭头向上和向下图标也应该附加到id标签。使用引导程序图标排序CakePHP表格

当数据以降序显示时，则应显示引导arrow-bottom图标，并且当数据按升序显示时，则应显示图标arrow-up。

UsersController.php

public $paginate = array('limit'=>4); 

public function index() { 
     $this->User->recursive = 0; 
     $this->set('users', $this->paginate()); 
}

index.ctp

<div class="users index"> 
<h2><?php echo __('Users'); ?></h2> 

<table class="zebra-striped table-bordered " cellpadding="0" cellspacing="0"> 
<tr> 
     <th> 
      <a href='' > 
       <?php echo $this->Paginator->sort('id'); ?> 
       <i class='icon-arrow-up'></i> 
      </a> 
     </th> 
     <th><a href='' >First Name <i class='icon-arrow-down'></i> 
     </a> </th> 
     <th>Last Name <i class='icon-resize-full'></i></a></th> 

</tr> 
    <?php foreach ($users as $user): ?> 
    <tr> 
    <td><?php echo h($user['User']['id']); ?>&nbsp;</td> 
    <td><?php echo h($user['User']['first_name']); ?>&nbsp;</td> 
    <td><?php echo h($user['User']['last_name']); ?>&nbsp;</td> 

    </tr> 
     <?php endforeach; ?> 
    </table> 
<p> 
<?php 
    echo $this->Paginator->counter(array(
     'format' => __('Page {:page} of {:pages}, showing {:current} records out of {:count} total, starting on record {:start}, ending on {:end}') 
)); 
?> </p> 

<div> 

    <div class="pagination"> 
<ul> 

    <?php 

      echo $this->Paginator->prev(__('prev'), array('tag' => 'li'), 
      null, array('tag' => 'li','class' => 'disabled','disabledTag' => 'a')); 
      echo $this->Paginator->numbers(array('separator' => '','currentTag' 
      => 'a', 'currentClass' => 'active','tag' => 'li','first' => 1)); 
      echo $this->Paginator->next(__('next'), array('tag' => 'li','currentClass' => 'disabled'), null, array('tag' => 'li','class' => 'disabled','disabledTag' => 'a')); 
     ?> 
    </ul> 
</div>

来源

2013-08-17 DR Jerry

请总是提到你正在使用的精确CakePHP的版本！ – ndm

使用PaginatorHelper::sortDir()检查当前排序方向，并建立基于该值类名：

<i class='icon-arrow-<?php echo $this->Paginator->sortDir() === 'asc' ? 'up' : 'down'; ?>'></i>

要嵌入到这个排序链接，通过HTML作为第二个参数来PaginatorHelper::sort()，并设置escape选项设置为false：

$type = $this->Paginator->sortDir() === 'asc' ? 'up' : 'down'; 
$icon = "<i class='icon-arrow-" . $type . "'></i>"; 
echo $this->Paginator->sort('id', $icon, array('escape' => false));

这应该导致像一个链接：

<a href="/.../page:1/sort:id/direction:asc/"><i class='icon-arrow-up'></i></a>

来源

2013-08-17 11:05:01 ndm

一使用jQuery简单的解决方案，只需添加下面3条线在默认的application.js或布局/ default.thtml中

$('th a').append(' <i class="icon-sort"></i>'); 
$('th a.asc i').attr('class', 'icon-sort-down'); 
$('th a.desc i').attr('class', 'icon-sort-up');

基础的解决方案的另一种简单的CSS，包含Font Awesome的必要文件。

th > a:after { 
    content: " \f0dc"; 
    font-family: FontAwesome; 
} 
th > a.asc:after { 
    content: " \f0dd"; 
    font-family: FontAwesome; 
} 
th > a.desc:after { 
    content: " \f0de"; 
    font-family: FontAwesome; 
}

来源

2013-08-28 10:41:53

简单的基于CSS的解决方案很有帮助。 –

您也需要检查的关键，所以这将是

<?php echo $this->Paginator->sort('title', 'My great title'); ?> 
<?php if ($this->Paginator->sortKey() == 'title'): ?> 
    <i class='fa fa-sort-<?php echo $this->Paginator->sortDir() === 'asc' ? 'up' : 'down'; ?>'></i> 
<?php else: ?> 
    <i class='fa fa-sort'></i> 
<?php endif; ?>

来源

2014-09-15 11:13:58

使用引导程序图标排序CakePHP表格

回答

相关问题