Using getElementById from external JavaScript to an asp Literal variable

Question

I'm trying to read a variable named ID="_errors" into my javascript using getElementById, but something about my implementation causes my JS file to be ignored.

This is the HTML:

...
    <asp:TextBox ID="_password" CssClass="login" runat="server" TextMode="Password" />
    <label class="mylabel" for="<%=_errors.ClientID%>"></label>
    <table id="table1">      
        <tr>
            <td style="width: 100px;"></td>        
            <td><span class="response1" runat="server"><asp:Literal ID="_errors" runat="server" /></span></td>                           
        </tr>
        <tr>
            <td style="width: 280px;"></td>
            <td><asp:Button ID="_login" CssClass="mybutton" runat="server" Text="Login" /></td>
        </tr>
    </table>
...

This is how I reference _errors in my .js file:

var PassWord            = document.getElementById('_login__password').value;
var Errors              = document.getElementById('_login__errors').value;

I reference my PassWord value here, because it works just fine. By viewing my page source I use the ClientID to know what the ID for _errors is.I did the same for PassWord. The thing that worries me (and the likely source of the error) is that the portion <asp:Literal ID="_errors" runat="server" /> does not show up in the page source at all. Any clue as to what might be the problem here?

You are not seeing the Literal control rendered on the page because without its Text property set, it will not render anything - including a wrapping tag the way that a Label control does. — MKS
– MKS, Commented Jan 7, 2013 at 18:23

Icarus · Accepted Answer · 2013-01-07 18:27:29Z

1

When you put a literal control in your page, it simply renders the content without enclosing it into any html element

For example:

<Asp:literal runat="Server" Text="Hello" />

Will render as:

 Hello

Therefore, the call to document.getElementById fails because there's no element with that id...

If you want the literal control to render as span with an id, then set the Text property like this:

<asp:literal runat="server" Text="<span id='_errors'>Hello</span>" />

edited Jan 7, 2013 at 18:27

answered Jan 7, 2013 at 18:22

Icarus

64k14 gold badges102 silver badges116 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jacco · Accepted Answer · 2013-01-07 20:18:35Z

You can't access the literal by it's ID, as already stated.

You could simply set the ID on the surrounding <span> and make that element "run at server":

...
    <asp:TextBox ID="_password" CssClass="login" runat="server" TextMode="Password" />
    <label class="mylabel" for="<%=_errors.ClientID%>"></label>
    <table id="table1">      
        <tr>
            <td style="width: 100px">&nbsp;</td>        
            <td><span ID="_errors" class="response1" runat="server" /></td>                           
        </tr>
        <tr>
            <td style="width: 100px">&nbsp;</td>
            <td><asp:Button ID="_login" CssClass="mybutton" runat="server" Text="Login" /></td>
        </tr>
    </table>
...

Notes:

I also added   to your otherwise empty td-elements, to prevent displaying problems
You can't set different sizes on cells within the same column

Collectives™ on Stack Overflow

Using getElementById from external JavaScript to an asp Literal variable

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related