Yii2 GridView 更改排序图标

Question

我已经安装了 yii2，我想更改 GridView 排序图标和类。 我怎样才能做到这一点？我在 yii2 文档中搜索但没有找到。

Yii2 网格代码：

<?php echo GridView::widget([
'dataProvider' => $dataProvider,
'filterModel' => $searchModel,
'columns' => [
    ['class' => 'yii\grid\SerialColumn'],

        [ 
            'attribute' => 'createdate',
            'label' => Yii::t('app', 'Created'),                
            'value' => function ($data) { return '4 September 2013'; }, 
        ],

    ...

    ['class' => 'yii\grid\ActionColumn'],
  ],
]);

Answer 1

将

web/css/site.css

更改为升序（使用 desc 降序）。使用您自己的图标网址。

a.asc:after {
content: url(link/to/images/img.jpg);
}

使用以下命令将类别添加到您的单元格

'contentOptions' => ['class' => 'come-class']

Answer 2

尝试创建自己的类扩展 ActionColumn

class myActionColumn extends ActionColumn {
    public function initDefaultButtons()
    {
        if (!isset($this->buttons['view'])) {
            $this->buttons['view'] = function ($url, $model, $key) {
                $options = array_merge([
                    'title' => Yii::t('yii', 'View'),
                    'aria-label' => Yii::t('yii', 'View'),
                    'data-pjax' => '0',
                ], $this->buttonOptions);
                return Html::a('<span class="glyphicon glyphicon-eye-open"></span>', $url, $options);
            };
        }
        if (!isset($this->buttons['update'])) {
            $this->buttons['update'] = function ($url, $model, $key) {
                $options = array_merge([
                    'title' => Yii::t('yii', 'Update'),
                    'aria-label' => Yii::t('yii', 'Update'),
                    'data-pjax' => '0',
                ], $this->buttonOptions);
                return Html::a('<span class="glyphicon glyphicon-pencil"></span>', $url, $options);
            };
        }
        if (!isset($this->buttons['delete'])) {
            $this->buttons['delete'] = function ($url, $model, $key) {
                $options = array_merge([
                    'title' => Yii::t('yii', 'Delete'),
                    'aria-label' => Yii::t('yii', 'Delete'),
                    'data-confirm' => Yii::t('yii', 'Are you sure you want to delete this item?'),
                    'data-method' => 'post',
                    'data-pjax' => '0',
                ], $this->buttonOptions);
                return Html::a('<span class="glyphicon glyphicon-trash"></span>', $url, $options);
            };
        }
    }
}

并更改您需要的内容并使用此类而不是 ActionColumn 类

Answer 3

** 您可以使用此脚本简单地添加一个始终可见的排序图标 - 如果不根据**修改函数调用，请检查是否使用了 pjax

$script = <<< JS
    var removeSortIcon = function(event) {
            $('[data-sort]').each(function() {
                var element = $(this);
                if(element.hasClass('desc') || element.hasClass('asc') ){
                    element.remove('span');
                }else{
                    element.append(' <span class="glyphicon glyphicon-sort"></span>');
                }
            });
    }    
    $(document).ready(removeSortIcon);
    $(document).on('ready pjax:success', removeSortIcon);
JS;
$this->registerJs($script);

第二种方式：

 $dataProvider = new ActiveDataProvider([
        'query' => $query,
        'sort' => [
            'defaultOrder' => ['name' => SORT_ASC,'email' => SORT_ASC,'username' => SORT_ASC,],
        ],
  ]);