htmlasp.netserver-side-controls

Nested span elements where parent is server-side


In ASP.Net (4.5.2) I have nested <span> elements where the parent is a set as a server side control...

<p>
  This is the start of the text
  <span runat="server" visible="<%#someCode%>">
    This is some more Text
    <span class="myClass">with some other text inside</span>
    And a bit more after
  </span>
</p>

(Note, this is contained within a <asp:Repeater>)

It appears that ASP.Net doesn't cope with this, and appears to assume the inner </span> is the closure for the outer element. Meaning that when the visible="false" it will render like this...

<p>
  This is the start of the text
    And a bit more after
  </span>
</p>

I cannot convert either <span> into a <div> or <section> as it has to live within a <p> element (meaning the child elements cannot be blocks).

Is there any way to get around this issue?


Solution

  • OK then (too many comments).

    Alternatively use a Label:

    <p>
        This is the start of the text
        <asp:Label ID="Label1" runat="server" Visible="false" Text="This is some more Text">
            <span class="myClass">with some other text inside</span>
            And a bit more after
        </asp:Label>                    
    </p>
    

    or even:

    <p>
        This is the start of the text
        <asp:Label ID="Label1" runat="server" Visible="true" Text="This is some more Text<span class='myClass'>with some other text inside</span>And a bit more after">                
        </asp:Label>                    
    </p>