How can I hide an HTML table row <tr> in aspx file and enable in code behind?

Question

I have a very small search functionality and I have a table row called "Search Results", I want this table row get displayed whenever i have something to display from the search results. So I want to hide this row by default and enable via code behind when my search is fetching some result.

<div>
    <table>
        <tr id="srchResultHeader" style="display: none;" class="header">
            <td colspan="2" class="tdlogintitle" visible="false">Search Results</td>
        </tr>
        <tr>
            <td>/*Data to display actual result from database*/</td>
        </tr>
    </table>
</div>

I'm not able to get the reference of the above table id "srchResultHeader" in my code behind? What is wrong here in my code.

Answer 1

An id by itself is just a client-side identifier. In order for this to be referenced as a server-side object it needs to be a server-side control. The easiest way would just be to add runat="server" on the existing element:

<tr runat="server" id="srchResultHeader" style="display: none;" class="header" >

In this case you probably don't even need the style attribute, since you're controlling the hide/show functionality in server-side code. You can just set .Visible on the control to determine whether or not it renders to the client-side markup at all.

Answer 2

You could use server-side <asp:Table> for this very purpose. Otherwise <tr> is a client-side thing and is not directly accessible in the server-side code. <asp:Table> will render <table> tag on the client-side, but you can access it in the code-behind through its ID. The structure looks like this:

<asp:Table ID="MyTable" runat="server">
    <asp:TableRow runat="server" ID="MyRow1">
        <asp:TableCell>Some value</asp:TableCell>
    </asp:TableRow>
</asp:Table>

You can now write something like this in the code-behind:

MyRow1.Visible = False;