Change cursor style depending on sort or not

Question

I'm using the jqGrid and have 3 columns that can NOT be sorted. At this point the cursor changes to a hand when the user hovers over the headers regardless of sorting set to true or false. I'd like that cursor to be something other than a hand (text or pointer) on those column heads. It's confusing to the users this way. Is this something that can be set?

Thanks, Mark

Answer 1

I find the question very good. So +1 from me.

You are not the first person (and not the last one) who wish to have another cursor on non-sortable columns. It's pity, but jqGrid gives you not classes or some other simple attributes which can be used to find the elements at which one can set CSS "cursor:default".

So I suggest to do this with the following code:

var myGrid = $("#list");

// create the grid
myGrid.jqGrid({
  // all jqGrid parameters
});

// fix cursor on non-sortable columns
var cm = myGrid[0].p.colModel;
$.each(myGrid[0].grid.headers, function(index, value) {
    var cmi = cm[index], colName = cmi.name;
    if(!cmi.sortable && colName!=='rn' && colName!=='cb' && colName!=='subgrid') {
        $('div.ui-jqgrid-sortable',value.el).css({cursor:"default"});
    }
});

You can see on the demo live that the method work. In the demo the last column 'Notes' is non-sortable.

It would be nice if such behavior would be standard in the next version of jqGrid. I will try to find time and to write suggestion what from the code of jqGrid should be changed to make the behavior out-of-the-box.

UPDATED: The problem with the cursor on non-sortable columns is not exist more in free jqGrid 4.8.

Answer 2

Welcome to SO.

Absolutely. CSS:

th.unsortableclass {
cursor: default;
}

Now apply that class to your column headers that aren't sortable.