How to add a css class-name to a BoundField so that I can find it with jQuery after GridView is rendered?

Question

Hi,

I want to add a class name to some of my BoundFields in the GridView control; so that once the GridView is data-bound and rendered I can obtain something like:

<td class="Tag1">Some data came from data source </td>

The purpose of doing such a thing is to be able to find all the elements that are "Tag1" in this way:

var allTag1td = $('td.Tag1');

So, how can I add this class to the BoundField so that it is rendered in this way?

thank you

Answer 1

Can you not directly set the itemstyle property of your boundfield in the aspx?

(TableItemstyle has a CssClass property)

See:

• http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.datacontrolfield.itemstyle.aspx
• http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.tableitemstyle_properties.aspx

Answer 2

I've done someting like this in the RowCreated_Event. I had to style the cells according to they values.

http://msdn.microsoft.com/de-de/library/system.web.ui.webcontrols.gridview.rowcreated.aspx

Answer 3

You can set a row's cell CssClass property to Tag1 when the row's created (RowCreated event).

Page.aspx:

<asp:GridView OnRowCreated="grid_RowCreated" AutoGenerateColumns="true" runat="server" ID="grid"></asp:GridView>

Code-behind file, Page.aspx.cs:

protected void grid_RowCreated(object sender, GridViewRowEventArgs e) {
    foreach (TableCell cell in e.Row.Cells)
        cell.CssClass = "Tag1";
}

The code will set the class attribute of each td in your table to Tag1; the markup of the rendered page will look like the one you're looking for:

<td class="Tag1"></td>
<td class="Tag1"></td>
...