View Full Version : Format dataGrid data

29 Jun 2011, 10:51 AM
I'm trying to accomplish something that I kind of feel silly for not being able to figure out. I'm trying to add a CSS class to the cells of a dataGrid.

I've tried setting up a renderer that is simply

function formatCells(val){
return "<span class='myClass'>" + val + "</span>";

but it told me that it was missing a ";".

Then I read somewhere that you should be able to say metadata.css = 'myClass', so I tried that. Now it says "metadata is not defined". It seems like this is way harder than it needs to be, I've never spent this much time trying to figure out how to change a font and center align something.

Anybody know what the easiest way to accomplish this is? Also, is there a way to apply a separate CSS class to the header row?

29 Jun 2011, 11:11 AM
Using metadata.css is a good way to do this, but you forgot to define metadata as being the 2nd parameter passed to the renderer function.

Check out the docs for the renderer function at http://dev.sencha.com/deploy/ext-3.4.0/docs/?class=Ext.grid.Column#Ext.grid.Column-renderer it contains other params such as the rowIndex so this should let you do special things for the header.