using javascript with server controls

Question

I am trying to use javascript with server controls.

Aim
To make my panel visible on mouseover event of text box(asp control)

Problem areas
new to javascript and asp.net.
getting javascript errors at run time
went thru all possible solutions from different forums but not able to customize them accordingly.

The code runs on this ASP.NET Control

<asp:TextBox ID="TextBox1" runat="server" 
      ontextchanged="TextBox1_TextChanged" 
      onmouseover="enablepanel()" 
      Width="76px" 
      Text="--SELECT--">
</asp:TextBox>

Tried these scripts

function enablepanel(sender, target) {
    document.getElementById(target).removeAttribute("disabled");
}

function enablepanel() {
    var id = $get("<%=Panel1.ClientID %>");
    if (id != null) id.disabled = false;
    $get("#<%= ButtonSave.ClientID%>").removeAttr("disabled");
    var controls = document.getElementById("<%=Panel1.ClientID%>");
    controls.disabled = false;
}

function enablepanel() {
    document.getElementById(div1).disabled = "false";
}

Its not working.

Request
if possible try to make it simple as we call functions in html when we use javascript otherwise just go with the solution.

Adding the code in question comments is unreadable. Edit your question to include the code, and use the code formatting button {} to make it readable. Include your event handler, the code that assigns the handler, and the related bit of HTML. And tell us what errors you're getting. And are you trying to make your panel "visible" like your question says or "enabled" like your code is trying to do? — nnnnnn
– nnnnnn, Commented Aug 17, 2011 at 7:39

cillierscharl · Accepted Answer · 2011-08-17 07:51:11Z

1

In your comments you reference making your panels enabled/disabled however in your requirement you specify that the panel needs to be either visible/invisible.

The javascript to do the following would look like this:

function enablePanel() {
    document.getElementById('div1').style.visibility = 'visible'; //visibility OR
    document.getElementById('div1').disabled = false;              //enabled
}
function disablePanel() {
    document.getElementById('div1').style.visibility = 'hidden';  //invisible OR
    document.getElementById('div1').disabled = true;               //disabled    
}

For your server side textboxes you can hook up the clientevents in the Page_Load section of your code:

//Page Load
TextBox1.attributes.add("onmouseover","enablePanel()")
TextBox1.attributes.add("onmouseout","disablePanel()")

edited Aug 17, 2011 at 7:51

answered Aug 17, 2011 at 7:46

cillierscharl

7,1053 gold badges31 silver badges46 bronze badges

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

Collectives™ on Stack Overflow

using javascript with server controls

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related