Why can't I bind visible of a control without runat=server?

Question

In other words, why can't I do this:

<a id="projectsButton" 
visible=<%= someFunctionWhichEvalsToFalse() ? false : true %>>
</a>

It seems to do nothing. I checked this by switching the false and true.

What can I do about this?

Answer 1

You can do it, but it won't do anything, since HTML has no visible attribute.

Instead, you can set the display CSS property, like this:

<a id="projectsButton" 
   style="display: <%= someFunctionWhichEvalsToFalse() ? "none" : "inline" %>">

Alternatively, you can put the entire tag into an if block, like this:

<% if (!someFunctionWhichEvalsToFalse()) { %>
    <a id="projectsButton"></a>
<% } %>

Answer 2

Visible is only available to server controls, hence why you need runat="server"

If you want to do this without making that a server control, you could try something like:

<a id="projectsButton" style='display:<%= someFunctionWhichEvalsToFalse() ? "none" : "inline" %>'></a>

Answer 3

Put another way, your question is why can't you use a server control property on an HTML element without it being a server control. The answer is because its not a server control, and server control properties only work on server controls. HTML tags are treated as plain text.

Answer 4

You can do a display:none in CSS to hide the element, although the element will be sent to the client. To really hide it you can wrap it in a <asp:PlaceHolder> control and bind the Visible attribute on the PlaceHolder.

<asp:PlaceHolder ID="placeholder" runat="server" Visible="<%# someFunctionWhichEvalsToFalse() %>">
    <a id="projectsButton" href="#">link</a>
</asp:PlaceHolder>

That will prevent the link html from being sent to the client.

Answer 5

This would render an a element to the screen with the visible attribute, which is not a valid attribute for an a element according to W3C . You probably want to set the uppercase Visible property of the HtmlGenericControl that will be created in your designer file as a result of adding runat="server" to the declaration of the element.