Srikanth
Srikanth

Reputation: 35

Apply style to a <td> in repeater control

I need to apply style and highlight the header coloumn which is sorted.. Sorting is handled in rptMyTable_ItemCommand event.. i cant use gridview as the layout of displaying data is not a regular table. in javascript we have something like document.getElementById('lbCol1Header').parentNode.style = 'sortedColumnCSS' how to do this in codebehind?

  <table border="0" cellpadding="5" cellspacing="0" width="100%" class="myCSS">
    <asp:Repeater ID="rptMyTable" runat="server" OnItemCommand="rptMyTable_ItemCommand">
        <HeaderTemplate>
            <tr style="font-weight: bolder">
                <td>
                    <asp:LinkButton ID="lbCol1Header" Text="Col1" runat="server" CommandName="sortCol1" />
                </td>
                <td>
                    <asp:LinkButton ID="lbCol2Header" Text="Col2" runat="server" CommandName="sortCol2" />
                </td>
                <td>
                    <asp:LinkButton ID="lbCol3Header" Text="Col3" runat="server" CommandName="sortCol3" />
                </td>
                <td>
                    <asp:LinkButton ID="lbCol4Header" Text="Col4" runat="server" CommandName="sortCol4" />
                </td>
                <td>
                    <asp:LinkButton ID="lbCol5Header" Text="Col5" runat="server" CommandName="sortCol5" />
                </td>
                <td>
                    <asp:LinkButton ID="lbCol6Header" Text="Col6" runat="server" CommandName="sortCol6" />
                </td>                    
                <td>
                    &nbsp;
                </td>
                <td>
                    &nbsp;
                </td>
            </tr>
        </HeaderTemplate>
        <ItemTemplate>
 //Table Data......with nested tables and divs
.
.
.
.
.
        </ItemTemplate>
   </asp:Repeater>
<tr style="font-weight: bolder">
    // doing paging operations here...
</tr>
</table>

Upvotes: 0

Views: 3214

Answers (2)

Prince Antony G
Prince Antony G

Reputation: 932

In Design Page:

<tr class='<%# StyleSheet(DataBinder.Eval(Container.DataItem, "Y"))%>'>

for Linkbutton :

<asp:LinkButton ID="lbCol1Header" Text="Col1" runat="server" CommandName="sortCol1" CssClass='<%# StyleSheet(DataBinder.Eval(Container.DataItem, "Y"))%>' />

In code Page:

 public static string StyleSheet(object objText1)
{
    string val = string.Empty;
    if (objText1.ToString() == "Y")
    {
        val = "trbind";
    }
    return val;
}

This is one of the way to apply style the in tr tag while in runtime based on the data.Similar you can try for the label also.

write the style trbind in stylesheet.

Upvotes: 1

Abe Baehaki
Abe Baehaki

Reputation: 61

You could use .CssClass property in the rptMyTable_ItemCommand event I guess.

lbCol1Header.CssClass = "sortedColumnCSS";

If you want to apply the css class to you should give ID and add runat="server".

<td ID="tdCol1Header" runat="server">
    <asp:LinkButton ID="lbCol1Header" Text="Col1" runat="server" CommandName="sortCol1" />
</td>

And to add the css class from your code behind.

tdCol1Header.Attributes("class") = "CssClass";

Upvotes: 0

Related Questions