Login Register

Grid Headers - Apply styles?

Is there a way to specify, on a per-column basis, an un-sortable column? Or, alternatively, apply custom styles to a header? This apparently doesn't work:

// blah blah
var view1 = {
    cells: [
        [{name: 'ID', field: "ID", width:'100px', formatter:showFriendlyId, noSort:true, cls:'noSortClass'},
         {name: 'Title', field: "title",width:'300px'}]]
        };
// more blah blah grid wackyness

I've also tried 'sortable:false' and variants thereof. I can't find in the dojo source where it translates these cell definitions to actual headers in the grid. Anyone have experience with this?

Damn I wish Ext hadn't change their licensing...

call onStyleRow function

call onStyleRow function and in its body you can write like this.

dojo.addClass(dojo.query(".dojoxGrid-cell",this.headerNode)[1],"xxxx");

where xxxx is css class.

Its working 4 me. Hope u too.

works but...

The 'onStyleRow' function is called for every row... so if I just want to style the header it will do it N times (where N is the number of Rows visible in the Grid). Surely there's some kind of initial rendering event I can hook into to just apply the styles once?

Found a better way

... To apply styles to grid headers... in your layout def, have something like this:

var view1 = {
cells: [[{name: 'Rating', field: "average",width:'50px',canSort:false,classes:'noSortHeader'}]]};

Pay attention to the 'classes' property. This will be applied to the entire column.
Now, to apply the class only to the header your css must look like:

.tundra .dojoxGrid-header .noSortHeader{
                        color:green !important;
                }

In this case, the tundra theme was used. It looks like the theme uses !important tags on the header styles (bad dojo, bad!), so be sure to use them on your overriding styles.

PS - the 'noSort' attribute I found as a hack in another post, as oddly the grid doesn't allow for this by default.

yes. We can even use

yes. We can even use "headerClasses" instead of classes , will it be more better?

Using headerClasses results

Using headerClasses results in the need to override the css in the same way, I guess I'm not sure what they had in mind when allowing for such attributes in the config for the cols. Maybe it'll get fixed in the next version?