TypeError: Cannot read property 'style' of null in javascript?

Question

I have a checkbox and textbox. When the checkbox is checked, textbox is visible, I want.But I have some error

<asp:CheckBox  type="checkbox" runat="server" ID="chkAnswer2" onClick="openclose(this.checked, 'txtquestionAnswer1');" />

<asp:TextBox id="txtquestionAnswer1" Visible="false" style="resize:none;"  TextMode="multiline" Columns="50" Rows="5" runat="server" />

And java script Part:

function openclose(check, id) {
        if (check)
            document.getElementById(id).style.display = 'block';
        else
            document.getElementById(id).style.display = 'none';

But I have this error: TypeError: Cannot read property 'style' of null

How to fix this problem?

Thanks for your answers

Answer 1

The id you give an asp:TextBox is not the ID it has on the client; that's ClientID . So:

<asp:CheckBox  type="checkbox" runat="server" ID="chkAnswer2" onClick="openclose(this.checked, '<%= txtquestionAnswer1.ClientId %>');" />
<!-- Change is here ---------------------------------------------------------------------------^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^  -->

<asp:TextBox id="txtquestionAnswer1" Visible="false" style="resize:none;"  TextMode="multiline" Columns="50" Rows="5" runat="server" />

Answer 2

asp.net generates new id's for the elements when translating them to plain html.

you have 2 options:

either set clientIdMode="static" to keep the same id you set,

or use preprocessor directive to instruct visual studio to get the newly generated id insead:

"#<%= chkAnswer2.ClientID%>"