Howdy,
I just recently began playing around with Ext and YUI, this is some great stuff! :-)
I have a grid, and based on whether one of the columns in the dataset is marked 'true' or 'false', I'd like to be able to modify the style of the entire row. Any thoughts on the best way to do that?
Some more details --
I have a grid that's pulling in data from a database. Each row has a status flag of either "seen" or "unseen", based on whether or not the user has seen the data associated with that given row.
If a user clicks a row in the grid, it goes out and pulls down some additional information that gets displayed somewhere else on the page. At this point, the record is now "seen".
What I'd like to do is have "unseen" records display in bold and slightly large size, and "seen" records display in a normal font.
Now, in the ColumnModel, I see a way to statically set an id for a given cell, but I haven't run across a way to do so dynamically (based on the contents of a given cell as the data is being loaded). It may also be preferable to be able to set a style or class rather than id (since they aren't unique), and to do so for the entire row rather than just a cell.
Is there a recommended way of going about that?
Thanks in advance!
-Eric
# 2  |
| Currently you would have to add the css class to each cell using the template parameters object passed as the second parameter. Since this is a common pattern, I have added a new optional function to the GridView called getRowClass that can return a css class (or classes) to apply to a row. e.g. var view = new Ext.grid.GridView({ getRowClass : function(record, rowIndex){ if(record.data.unread){ return "unread-row"; } } }); var grid = new Ext.grid.Grid({ .... view : view }); This will be in the next revision. Also, for convenience, I added a function refreshRow(record) to GridView. Record can either be the record object, or index in the store. When you mark your records as read, you can call record.set('unread', false); and it will automatically trigger the refresh though. |