show panel with registerstartupscript

 <asp:Panel ID="filterBanners" runat="server" Visible ="false"> 
    <h3> Testing </h3>
 </asp:Panel>

I'm trying to set the panel visibility to true in this way, but it doesn't work:

Page.ClientScript.RegisterStartupScript(this.GetType(), "ScriptBlock", "$('#filterBanners').show();", true);

or

 ScriptManager.RegisterStartupScript(this, this.GetType(), "ShowCode5", "$('#filterBanners').show();", true);

Answers


The id filterBanners of the Panel would be changed by asp.net for generated html so jQuery wont find it. you need to use the ClientID instead of server id in jQuery / javascript to access the Panel.

ScriptManager.RegisterStartupScript(this.GetType(), 
  "ScriptBlock", "$('#"+ filterBanners.ClientID+"').show();", true);

If you have .net framework then you can also set ClientIDMode to "static" to let the asp.net keep the client id same as server id.

ClientIDMode = Static

The ClientID value is set to the value of the ID property. If the control is a naming container, the control is used as the top of the hierarchy of naming containers for any controls that it contains.

You can also use class selector for panel but you will need to assign class to your Panel first.

HTML

 <asp:Panel ID="filterBanners" runat="server" CssClass="panel-class" Visible ="false"> 
    <h3> Testing </h3>
 </asp:Panel>

Code behind

ScriptManager.RegisterStartupScript(this.GetType(), "ScriptBlock", "$('.panel-class').show();", true);

Edit 1

Note you have to ensure that jQuery is loaded before your script executed, try using the native javascript method to access panel.

Edit 2

You are hiding the panel by setting visible="false" in html which will result in no html generated for the panel so javascript could not find the panel. You have to set its visible property to true in html to generate html for it.

The following code is tested and working.

HTML

 <asp:Panel ID="filterBanners" runat="server" Visible ="true"> 
     <h3> Testing </h3>
 </asp:Panel> 

Code behind

 ScriptManager.RegisterStartupScript(this, this.GetType(), "ScriptBlock", 
 "document.getElementById('" + filterBanners.ClientID + 
 "') .style.display='none';", true);

Edit 3

If you want the panel initially hidden and you want to show it from server then do not use server side property visible="false" instead use style="display:none;" in html.

HTML

<asp:Panel ID="filterBanners" runat="server" style="display:none;"> 
    <h3> Testing </h3>
</asp:Panel> 

Code behind

 ScriptManager.RegisterStartupScript(this, this.GetType(), "ScriptBlock", 
 "document.getElementById('" + filterBanners.ClientID + 
 "').style.display='block';", true);

Need Your Help

WPF: The name XYZ does not exist in XAML namespace

c# wpf xaml button

I was trying to make re-usable tamplete for image button, and found this great advice, but I wasn't able to make it work. Can you please advice my, what am I doing wrong? I am pretty newbie with WP...

Sniffing traffic between a Flex app and ColdFusion backend

flex debugging coldfusion amf sniffing

What is a good strategy for sniffing/tracing function calls between a Flex application and a ColdFusion-based backend running on ColdFusion server? I understand they use AMF protocol.

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.