ASP Textbox default invisible and visible from JS

Question

I have a textbox which will be initally invisible and checkbox OnClick JS method , I want the button to be visible ,

initally the checkbox seems invisible but when i click on the checkbox, JS Method gives me the error with object not found. and if i remove the Visible="false" from textbox code works fine.

<asp:Textbox id="day" runat="server" Visible="false" />

 <asp:CheckBox ID="parts" runat="server" onClick="Click();" />

 <script type="text/javascript">
 function Click(){
 document.getElementById("day").style.visibility = "visible";

 //ERROR **0x800a01a8 - Microsoft JScript runtime error: Object required**
 }
  </script>

//ERROR 0x800a01a8 - Microsoft JScript runtime error: Object required

Setting Visible="false" on a server side control means that it will never be rendered to the browser. — Coding Flow
– Coding Flow, Commented Nov 3, 2014 at 14:16
if I set on onload function this happens the same.. I am getting the same error in javascript — user3226440
– user3226440, Commented Nov 3, 2014 at 14:20
If you view the output page in your browser, you will also note the textbox id is not "day". You need to also set clientid="day" or change the ID generation method. — iCollect.it Ltd
– iCollect.it Ltd, Commented Nov 3, 2014 at 14:22
You can also try getElementById('<%= day.UniqueId %>') or getElementById('<%= day.ClientID %>') — Tim
– Tim, Commented Nov 3, 2014 at 14:37

Arindam Nayak · Accepted Answer · 2014-11-03 18:24:58Z

1

When you use visible=false, that is never rendered on page, implies, you can not do document.getEle.., it will always give you null value and hence , it will throw error.

If this property is false, the server control is not rendered. - MSDN

How to solve this

So it make it work, you need to make it hidden using javascript and then make it visible using javascript.

<asp:TextBox ID="day" runat="server" style="display:none;" />
<asp:CheckBox ID="parts" runat="server" onClick="Click();" />

<script type="text/javascript">
    function Click() {
        document.getElementById("day").style.display = "block"; // use "none" to hide
    }
</script>

answered Nov 3, 2014 at 18:24

Arindam Nayak

7,4924 gold badges36 silver badges51 bronze badges

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

Comments

iCollect.it Ltd · Accepted Answer · 2014-11-03 14:30:59Z

1

Use the static id mode instead, to stop it using an auto-generated id:

e.g.

<asp:Textbox id="day" ClientIDMode="Static" runat="server" Visible="false" />

Also as you tagged this as jQuery the simpler jQuery could would look like this (if the code follows the elements on the page):

   $('#day').click(function(){
       $(this).show();
   });

or this if the code precedes the elements, wrap it in a DOM ready handler:

$(function(){
       $('#day').click(function(){
           $(this).show();
       });
});

$(function(){...}); is just a handy shortcut for $(document).ready(function(){...});

edited Nov 3, 2014 at 14:30

answered Nov 3, 2014 at 14:25

iCollect.it Ltd

93.9k26 gold badges189 silver badges210 bronze badges

Collectives™ on Stack Overflow

ASP Textbox default invisible and visible from JS

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