CODEWITHSUNDEEP
javascriptasp.net
user1012259
user1012259

Reputation:

using javascript with server controls

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.

Upvotes: 3

Views: 898

Answers (1)

cillierscharl
cillierscharl

Reputation: 7117

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()")

Upvotes: 1

Related Questions