S
Steven Cheng[MSFT]
Hi James,
Thank you for using Microsoft Newsgroup Service. Based on your description,
you want to hidden a ASP.NET Panel server
control in the client javascript. Is my understanding correct?
If so, here is my suggestion on this issue:
Generally in ASP.NET most ServerControls have the Visible attribute which
can be set in server-side code to show/hide
them. However, you need to know that the ASP.NET servercontrols are not
really HTML element, when render into
browser, the ASP.NET will output them as the proper html element in terms
of the client's browser's capability. For
example, as for the Panel server control, such as
<asp
anel id="pnlTest" runat="server">
In the Panel
</aspanel>
When you run the page and view its html source via the "View Source"
MenuItem, you will find that there is no "Panel"
element in the client html doucment, the "Panel" is represened by a "div"
like:
<div id="pnlTest">
In the Panel
</div>
We still can identify it via the "id", this will remain from serverside to
client.
Also, in clientside javascipt, you can manipulate the html element's
attribute via the DOM object. To show or hide an
element, you need to set its "display" attribute in its css style. Do
remember that no "Visible" attribute in html , it is
abstracted by the ASP.NET in serverside. And here is a simple page shows
how to hide the panel(div) via change its "
display" attribute in client side script:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>ClientSide</title>
<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
<meta content="C#" name="CODE_LANGUAGE">
<meta content="JavaScript" name="vs_defaultClientScript">
<meta content="http://schemas.microsoft.com/intellisense/ie5"
name="vs_targetSchema">
<script language=javascript>
function doHide()
{
document.all("pnlTest").style.display = "none";
}
function doShow()
{
document.all("pnlTest").style.display = "inline";
}
</script>
</HEAD>
<body>
<form id="Form1" action="WebForm1.aspx" method="post" runat="server">
<table width="500" align="center" border="1">
<tr>
<td>
<aspanel id="pnlTest" runat="server">
<asp:TextBox id="TextBox1" runat="server"></asp
:TextBox>
<asp:Button id="Button1" runat="server" Text="
Button"></asp:Button>
<asp:Label id="Label1" runat="server">Label</asp
:Label>
</aspanel>
</td>
</tr>
<tr>
<td><input type=button id="btnHide" name="btnHide" value="Hide
Panel" onclick="doHide()" /></td>
<td><input type=button id="btnShow" name="btnShow" value="Show
Panel" onclick="doShow()" /></td>
</tr>
</table>
</form>
</body>
</HTML>
Please try out the preceding suggestion to see whether it helps. If you
have any questions on it, please feel free to let me know.
Steven Cheng
Microsoft Online Support
Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)
Thank you for using Microsoft Newsgroup Service. Based on your description,
you want to hidden a ASP.NET Panel server
control in the client javascript. Is my understanding correct?
If so, here is my suggestion on this issue:
Generally in ASP.NET most ServerControls have the Visible attribute which
can be set in server-side code to show/hide
them. However, you need to know that the ASP.NET servercontrols are not
really HTML element, when render into
browser, the ASP.NET will output them as the proper html element in terms
of the client's browser's capability. For
example, as for the Panel server control, such as
<asp
anel id="pnlTest" runat="server">In the Panel
</asp
anel>When you run the page and view its html source via the "View Source"
MenuItem, you will find that there is no "Panel"
element in the client html doucment, the "Panel" is represened by a "div"
like:
<div id="pnlTest">
In the Panel
</div>
We still can identify it via the "id", this will remain from serverside to
client.
Also, in clientside javascipt, you can manipulate the html element's
attribute via the DOM object. To show or hide an
element, you need to set its "display" attribute in its css style. Do
remember that no "Visible" attribute in html , it is
abstracted by the ASP.NET in serverside. And here is a simple page shows
how to hide the panel(div) via change its "
display" attribute in client side script:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>ClientSide</title>
<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
<meta content="C#" name="CODE_LANGUAGE">
<meta content="JavaScript" name="vs_defaultClientScript">
<meta content="http://schemas.microsoft.com/intellisense/ie5"
name="vs_targetSchema">
<script language=javascript>
function doHide()
{
document.all("pnlTest").style.display = "none";
}
function doShow()
{
document.all("pnlTest").style.display = "inline";
}
</script>
</HEAD>
<body>
<form id="Form1" action="WebForm1.aspx" method="post" runat="server">
<table width="500" align="center" border="1">
<tr>
<td>
<asp
anel id="pnlTest" runat="server"><asp:TextBox id="TextBox1" runat="server"></asp
:TextBox>
<asp:Button id="Button1" runat="server" Text="
Button"></asp:Button>
<asp:Label id="Label1" runat="server">Label</asp
:Label>
</asp
anel></td>
</tr>
<tr>
<td><input type=button id="btnHide" name="btnHide" value="Hide
Panel" onclick="doHide()" /></td>
<td><input type=button id="btnShow" name="btnShow" value="Show
Panel" onclick="doShow()" /></td>
</tr>
</table>
</form>
</body>
</HTML>
Please try out the preceding suggestion to see whether it helps. If you
have any questions on it, please feel free to let me know.
Steven Cheng
Microsoft Online Support
Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)