Hynek
Hynek

Reputation: 277

Dojo Datagrid: How to change the style of the first row?


I am new to DoJo development so this could be basic.
I have created an EnhancedDatagrid and it shows the data fine.
The data comes from an JSON store in a different page.
I have a button which causes that one new entry is created in the datastore and then my datagrid is 'refreshed'. This works fine.
But now i want only as the last step to change the style of the first row in my datagrid. (I need to make the newly added row more visible.)
But i simply can't figure out how to get a handle on the first row in a datagrid.

... grid = new dojox.grid.EnhancedGrid({
id: strId,
store: store,
structure: layout,
}, document.createElement('div'));
dojo.byId(placeHolder).appendChild(grid.domNode);
grid.startup();

var row = grid.getItem(0); // ---get the first row. How ? And how to apply new style ?
...

Thank you in advance.

Upvotes: 2

Views: 4391

Answers (1)

Hynek
Hynek

Reputation: 277

Solved the problem like this:

dojo.connect(grid, 'onStyleRow', this, function (row) {
    var item = grid.getItem(row.index);
    if (row.index == 0) {
        row.customClasses = "highlightRow";
        row.customStyles += 'background-color:#FFB93F;';
    }

});

I use the 'Claro' theme and it prevented me to set the background color of the row-cells. The solution was to set the customClasses to a style like this:

.highlightRow tr
{ 
background-color: #FF6A00 !important;
}  

Found part of the solution here: http://dojo-toolkit.33424.n3.nabble.com/row-customStyles-was-overwrite-by-claro-theme-td3763079.html

Upvotes: 6

Related Questions