javascript error in ASP.NET content page

Question

    <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<script type="text/javascript">
    function Test1(w) {
        document.getElementById('<%=TextBox1.ClientID%>').style.width = w;
        return false;
    }
    Test1(10); // This line arises an error. Why ?
</script>
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <input id="Button1" type="button" value="button" onclick="Test1(10)" />
</asp:Content>

I get error when the function Test1(10) is called from the script. But when it called on the click of button, it works fine. How can I call the function from the script(OR how I can access the onload() function in an ASP.NET Content Page)?

you should wait until the document is loaded

mgraph
– mgraph

2012-01-10 14:05:27 +00:00
Commented Jan 10, 2012 at 14:05 — mgraph
– mgraph, Commented Jan 10, 2012 at 14:05

Pointy · Accepted Answer · 2012-01-10 14:15:12Z

1

When your call to "Test1()" inside the <script> block happens, that input field is not yet part of the DOM. Thus the call to getElementById() will return null and the first line of the function will fail.

If you move the <script> block to after the text box, it should work.

edit — also you may want to explicitly append "px" to your width.

edited Jan 10, 2012 at 14:15

answered Jan 10, 2012 at 14:04

Pointy

415k62 gold badges600 silver badges631 bronze badges

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

Comments

mgraph · Accepted Answer · 2012-01-10 14:04:46Z

0

try this

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<script type="text/javascript">
    function Test1(w) {
        document.getElementById('<%=TextBox1.ClientID%>').style.width = w;
        return false;
    }
window.onload = function() {
    Test1(10); // This line arises an error. Why ?
}
</script>
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <input id="Button1" type="button" value="button" onclick="Test1(10)" />
</asp:Content>

answered Jan 10, 2012 at 14:04

mgraph

15.3k4 gold badges43 silver badges76 bronze badges

Comments

Reinstate Monica Cellio · Accepted Answer · 2012-01-10 14:05:05Z

0

It's because the textbox doesn't exist when you execute Test1 in the script. You either have to place the call in a document.ready function or move it further down the page, after the textbox.

answered Jan 10, 2012 at 14:05

Reinstate Monica Cellio

26.2k6 gold badges54 silver badges67 bronze badges

Comments

Sanosay · Accepted Answer · 2012-01-10 14:22:07Z

0

First of all you every time you want to execute javascript code, even directly from the tag ether from events you have to wait to load the dom level. So can do something like :

  <script type="text/javascript">
      window.onload =function()
      { /* code */ }
  </script>

Or execute your code in the "onload" event of the body tag: like

    <body onload="Test1(10);">
    </body>

Or if you use JQuery you can use the above :

  <script type="text/javascript">
      $(document).ready(function(){
        /* Code to execute */
      });
  </script>

answered Jan 10, 2012 at 14:22

Sanosay

5785 silver badges20 bronze badges

Collectives™ on Stack Overflow

javascript error in ASP.NET content page

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related