как сделать значки сортировки видимыми во всех заголовках столбцов в jqgrid независимо от статуса сортировки

Question

столбец jqGrid показывает значки сортировки только в том случае, если столбец отсортирован.

Как сделать иконки сортировки видимыми во всех столбцах, чтобы пользователь имел идею , что сортировка может быть выполнена щелчком в заголовке столбца? Вероятно, оба треугольника направления сортировки должны быть неактивными.

Telerik radgrid имеет это:

http://www.telerik.com/community/forums/aspnet/grid/possible-to-show-sort-icon-regardless-sort-status.aspx

Как реализовать это в jqGrid? В настоящее время нет никаких признаков того, что столбцы сортируются.

Update

Я попытался решение от ответа, используя colmodel ниже.

Вопросы:

1. Для узка и столбцы сортировки значков не отображаются или отображаются частично. В правой части заголовка столбцов имеется пустое пространство. Как уменьшить это пустое пространство, чтобы текст заголовка столбца и значок сортировки отображались в этой области?

2. После сортировки сортировать значки во всех столбцах, кроме отсортированных, теряются. Как их сохранить?

Answer 1

viewsortcols: [true, 'vertical', true]

Answer 2

Я считаю, что идея хорошая, поэтому я создал the demo, который реализует поведение:

Реализация этого с кодом:

var $grid = $("#list"), colModel; 

// create the grid 
$grid.jqGrid({ 
    // all typical jqGrid parameters 
    onSortCol: function (index, idxcol, sortorder) { 
     if (this.p.lastsort >= 0 && this.p.lastsort !== idxcol 
       && this.p.colModel[this.p.lastsort].sortable !== false) { 
      // show the icons of last sorted column 
      $(this.grid.headers[this.p.lastsort].el) 
       .find(">div.ui-jqgrid-sortable>span.s-ico").show(); 
     } 
    } 
}); 

// show sort icons of all sortable columns 
colModel = $grid.jqGrid('getGridParam', 'colModel'); 
$('#gbox_' + $.jgrid.jqID($grid[0].id) + 
    ' tr.ui-jqgrid-labels th.ui-th-column').each(function (i) { 
    var cmi = colModel[i], colName = cmi.name; 

    if (cmi.sortable !== false) { 
     // show the sorting icons 
     $(this).find('>div.ui-jqgrid-sortable>span.s-ico').show(); 
    } else if (!cmi.sortable && colName !== 'rn' && colName !== 'cb' && colName !== 'subgrid') { 
     // change the mouse cursor on the columns which are non-sortable 
     $(this).find('>div.ui-jqgrid-sortable').css({cursor: 'default'}); 
    } 
}); 

ОБНОВЛЕНО: Если вам нужно отобразить информацию в столбцах, в основном компактных, вы можете сделать некоторые настройки в CSS заголовка столбца. Например, по умолчанию у вас есть выравнивание по центру во всех заголовках столбцов. В отношении следующего CSS

.ui-jqgrid .ui-jqgrid-htable th.ui-th-column 
{ 
    text-align:left 
} 
.ui-jqgrid .ui-jqgrid-htable th.ui-th-column div.ui-jqgrid-sortable 
{ 
    margin-left:3px;margin-top:3px 
} 

Вы можете изменить его на выравнивание по левому краю. Как видно из результатов вы будете иметь более компактный вид заголовков столбцов:

увидеть соответствующую demo. Кстати, я рекомендую вам проверить, достаточно ли ширины столбца, чтобы показать значки сортировки в браузерах Webkit (Google Chrome или Safari).