2016-07-01 6 views
1

Я просто хочу добавить класс по умолчанию для отсортированного столбца.По умолчанию класс css для сортировки столбца в Yii2

У меня есть код, который добавить атрибут класса со значением «ASC» или «DESC», когда я отсортирован таблицу по этому столбцу (часть кода):

GridView::widget(
    [ 
     'dataProvider' => $dataProvider, 
     'columns' => [ 
      [ 
       'attribute' => 'id', // <---- sorted by default, have 'class="desc"' 
       'contentOptions' => ['style' => 'width: 120px'], 
      ], 
      [ 
       'attribute' => 'name', //<- want to append 'class="sortable"' 
       'contentOptions' => ['style' => 'text-align: left'], 
       'headerOptions' => ['style' => 'text-align: left'], 
      ], 
... 
     ] 
    ] 
); 

Что мне нужно - добавить «класс =" сортировкой «» сгенерированных

<a href="/my/action">Name</a> 

звеньев в THEAD

ответ

0

насколько я знаю, вы могли бы добавить (это свойство для каждого столбца, который должен иметь дополнительный класс или другие свойства, такие как стиль)

'headerOptions' => ['class' => 'sortable'], 

но добавить класс к-го элемента, то вы можете использовать его в CSS, как этот

th.sortable > a 
+0

нет свойства с именем '' headerOptions' в GridView' –

+1

@MuhammadOmerAslam Я верю, что это, это посмотреть на: renderHeaderCell в yiisofl \ yii2 \ сетки \ Column.php возврата Html :: тег ('th', $ this-> renderHeaderCellContent(), $ this-> headerOptions); также это не свойство компонента сетки как бет массив сетки колонн GridView :: виджет ([ .... 'столбцов' => [ ...... [ ... .... 'headerOptions' => ['style' => 'width: 140px;'], ] –

+0

Да, вы прямо здесь, я просто хотел забрать свой голос, но не смог настроить, вы можете редактировать вы должны упомянуть об этом в ответ, поскольку он выглядел так, что вы говорите о виде сетки. спасибо за очищение –

0

значок сортировки class устанавливается в файле по умолчанию site.css, загружаемого AppAsset.php в вашем application/views/layouts/main.php или если у вас есть другое имя для файла layout, вы должны отрегулировать css класс a.asc:after и a.desc:after, если вам нужно обновить значок для сортировки.

a.asc:after { 
    content: "\e155"; 
} 

a.desc:after { 
    content: "\e156"; 
} 

Кроме того, существует numerical и ordinal классов сортировки тоже, если вам нужно изменить их тоже в зависимости от требований.

.sort-numerical a.asc:after { 
    content: "\e153"; 
} 

.sort-numerical a.desc:after { 
    content: "\e154"; 
} 

.sort-ordinal a.asc:after { 
    content: "\e155"; 
} 

.sort-ordinal a.desc:after { 
    content: "\e156"; 
}