Hide a ASP.Net label in Javascript on KeyPress

Question

I have a label on a ASP.Net 4.0 website which I'm trying to hide when the users types into a textbox.

I have a Javascript function which I'm firing on the Keypressevent of a Textbox.

So, my Javascript function is:

function hideLabel(sender, e) {
    document.getElementById('<%=lblResult.ClientID%>').style.display = 'none';
}

And my textbox and labels are as follows:

<tr><td>
    <asp:Label ID="lblResult" runat="server" Visible="True"></asp:Label>
</td></td>
<tr><td>
  <asp:TextBox ID="txtEmailAddress" runat="server" Width="200px"
       CssClass="customtxt" onkeypress="hideLabel(this, event)"></asp:TextBox>
</td></td>

The function fires but I receive the following error: Microsoft JScript runtime error: Object required

I've also tried the below line of code within my function but this doesn't work either:

document.getElementById('lblResult').style.visibility = 'hidden';

Anybody got any idea why this is failing in IE 8 - it is working correctly in Chrome.

A couple of points: 1) With the label defined as you have done, it's actually being rendered as <span id="MainContent_lblResult">Text here</span> - which may not be what you intended - you should set the AssociatedControlID to the ID of the text box if you want a <label> instead. 2) Have you tried opening the IE Developer Tools (F12) and checked the Console for errors? The code as you have it should work, and I've tested a similar set up (albeit with IE9 in IE8 mode). — Zhaph - Ben Duguid
– Zhaph - Ben Duguid, Commented Feb 6, 2012 at 15:38
Your second JS attempt won't work: The control probably won't have the ID as you've written it (you're right to use the ClientID property), and Visibility is an ASP.NET property that doesn't exist in the DOM. — Zhaph - Ben Duguid
– Zhaph - Ben Duguid, Commented Feb 6, 2012 at 15:40

Ehsan · Accepted Answer · 2012-02-06 14:29:49Z

1

I think ,you do not need to pass any parameters to function in your case :

    function hideLabel() {
    document.getElementById("<%=lblResult.ClientID%>").style.display = "none";
}

<asp:TextBox ID="txtEmailAddress" runat="server" Width="200px" CssClass="customtxt" onkeypress="hideLabel()"></asp:TextBox>

answered Feb 6, 2012 at 14:29

Ehsan

1,1051 gold badge12 silver badges22 bronze badges

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

Comments

Sebastian Siek · Accepted Answer · 2012-02-06 14:48:39Z

1

just method without parameters would work.

<script language="javascript" type="text/javascript">
    function hideIt() {
        document.getElementById('<%=myLabel.ClientID%>').style.display = 'none'; 
    }
</script>

UPDATED :

HTML My Label

SCRIPT function hideIt() { document.getElementById('<%=myLabel.ClientID%>').style.display = 'none'; }

I can confirm that it does work.... What browser are you using , so I can test it?

edited Feb 6, 2012 at 14:48

answered Feb 6, 2012 at 14:35

Sebastian Siek

2,07518 silver badges16 bronze badges

4 Comments

user1131661 Over a year ago

I'm using IE8 but I've just tried it in Google Chrome and you're right it does work there. Is there some setting on my IE? I have other keypress events running on different forms.

user1131661 Over a year ago

Here is my code, hope this pastes ok: function hideLabel() { alert("Here"); document.getElementById('<%=lblResult.ClientID%>').style.display = 'none'; } <asp:TextBox ID="txtEmailAddress" runat="server" Width="200px" CssClass="customtxt" onkeypress="hideLabel()"></asp:TextBox> I've tried the hideLabel call without the () but it still doesn't work. Also here is the label box: <asp:Label ID="lblResult" runat="server" Visible="True"></asp:Label>

Sebastian Siek Over a year ago

can you render the page in browser and post the html source? that's got to be something to do with client ID.

user1131661 Over a year ago

OK, I've got this working now. I just had to check that the label wasn't null before trying this. After that it works. But thanks for all the help.

Paul · Accepted Answer · 2012-02-06 14:54:45Z

1

It's almost certainly failing b/c it's not finding the label you're looking for. Look at the generated source and make sure that the label is present on the page and that it's got the ID that is in the javascript generated output.

answered Feb 6, 2012 at 14:54

Paul

36.4k12 gold badges98 silver badges124 bronze badges

Collectives™ on Stack Overflow

Hide a ASP.Net label in Javascript on KeyPress

3 Answers 3

Comments

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related