.NET Tutorials, Forums, Interview Questions And Answers
Welcome :Guest
Sign In
Win Surprise Gifts!!!

Top 5 Contributors of the Month
david stephan
Gaurav Pal
Post New Web Links

Using jQuery .hide() and .show() on panel sets doesn't maintain status through postback. Viewstate

Posted By:      Posted Date: September 14, 2010    Points: 0   Category :ASP.Net
I'm using jQuery against a set of three asp panels.  I set up an 'onChange' function for a dropdown list that dictates which panels to hide and show based on the UI selection.When the page first loads, one of the panels will be shown, the others will be hidden.  Let's say pnlOne is showing because the dropdown has option 1 selected.  This is done on the server with this:pnlOne.Style.Add("display","block");//and all the other panels are set to ".Style.Add("display","none");" based on logic.Then, the user selects a different value in the dropdown.  Let's say they select option number 2.  With javascript and jQuery I do this:$("#<%=pnlOne.ClientID %>").hide();$("#<%=pnlTwo.ClientID %>").hide();$("#<%=pnlThree.ClientID %>").hide();switch($("#<%= ddlOptionNumber.ClientID %> option:selected").text()){case "1":$("#<%= pnlOne.ClientID %>").show();break;case "2": etc.,}The issue is when the page posts back.  I'm running client side validation only at this point.  (Even if I add client side in the future I will still run client side as well to avoid security issues.)  When the validation functions detect an issue and the page returns to be displayed, the original panel (pnlOne)

View Complete Post

More Related Resource Links

After async postback, hide/show panel stops working

I have a Gridview in an UpdatePanel with a column containing an "expander" button that shows (and hides) more detail beneath its row of data.  It all works great until the user pages the gridview.  After the async postback to page the gridview, the javascript function to toggle hide/show appears to work flawlessly (the expander's button image even changes correctly), but the detail panel just doesn't show on the page.Note that my expander control supports a "AsyncTriggerId" property that, if set in the markup, will rebind the javascript toggle function when that control triggers an async postback (see OnPreRender below)Here's the hide/show toggle javascript:function toggleExpander(divId, imgId) { var div = document.getElementById(divId); var img = document.getElementById(imgId); var cssClass = div.getAttribute("className"); if (div.style.display == "" || div.style.display == "none" || cssClass == "hidden") { div.style.display = "inline"; div.setAttribute("className", ""); img.src = "images/dir_down.png"; mce_src = "images/dir_down.png"; img.alt = "Collapse to hide details"; } else { div.style.display = "none"; img.src = "images/dir_rig

Checkbox will show panel based on selection without postback.. how to do



I have Two Checkbox in my asp.net textbox..

First what i want is

based on two checkbox user has to be select any one only..

if checkbox1 is selected then Panel1 visible true without postback

if checkbox2 is selected then Panel2 visible true without postback

jquery click event doesn't fire after postback anymore

Hello there,I have a small website where I want to display a confirmation dialog after clicking on a button.When you click the confirmButton the dialog appears. Then you can choose between Yes or No to either continue with the PostBack or to return.Problem: The first time you get into the site all works fine. But after you click Yes to continue with the PostBack, no click event will be triggered anymore.Here is some code.<asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <script type="text/javascript"> function loadConfirmDialog() { //Dialog configurieren jQuery('#confirmDialog').dialog({ autoOpen: false, width: 400, modal: true, resizable: false }); //Dialog öffnen jQuery('#confirmButton').bind('click', function () { jQuery('#confirmDialog').dialog('open'); return false; }); //Postback ausführen jQuery('#continueButton').bind('click', function () { jQuery('#confrimDialog').dialog('destroy'); __doPostBack('confirmButton', ''); }); //Postback abbrechen jQuery('#cancel

Jquery.tools tabs doesn't retain tab index on postback

The graphic designer of a project I'm building a web site for chose jquery.tools (http://flowplayer.org/tools/tabs/index.html) for a tabs tool in the site. Unfortunately it seems that the tool doesn't behave properly on a postback in IE7 or IE8 (it does behave properly in FireFox, Chrome and Safari). Does anyone have experience using the jquery.tools with asp.net? and know how to retain the tab index on a postback? I've tried a lot of things and can't get it to work. The code i'm using now is as follows:           $("ul.tabsScenario").tabs("div.panes > div");         var tabIndex = $('#ctl00_ContentPlaceHolder1_EnInDeToekomst1_HiddenFieldTabIndex').val();         $("ul.tabsScenario").tabs('select', tabIndex); where the tab index is stored in a hidden field (HiddenFieldTabIndex). The above code works fine in Firefox, Chrome and Safari, but not in IE7 or IE8. I am using a ScriptManager and UpdatePanels, but in an extremely simple website example I can't even get the jquery.tools tabs tool to work. There are some unanswered posts on the Jquery.Tools forum concerning this topic, but yeah, that doesn't help much. I've already determined that the

JQuery: is there a way to show status message - from code behind?


i am trying to figure out how to display message box after it done executing the server side code

 here is the code which works from the client side but still looking for a way to make it work from code-behind


<div id="status"></div>


$("#status").fadeTo(500, 1, function() { $(this).html("You are now registered!").fadeTo(7000, 0); })

Color Box Jquery Not Working in Update Panel After the Initial Postback


Hi Guys,

I have an UpdatePane that contains a Listview


		<asp:LinkButton ID="lnkName" runat="server" CommandArgument='<%# Container.DisplayIndex %>'
            CommandName="SelectedRow" Text='<%# Eval("Name") %>' Class="info" Rel='<%# Eval("ID") %>' />

This linkButton will serves as the trigger to call my color box jquery. Function stated below

 <script src="script/jquery-1.4.1.min.js" type="text/javascript"></script>
    <script src="script/jquery.colorbox-min.js" type="text/javascript"> </script>
    <script type="text/javascript">

        $(document).ready(function() {

            $("a.info").click(function() {

                $(this).attr("href", "EmployeeDirectoryDetail.aspx?id=" + $(this).attr("rel"));
                $(this).colorbox({ height: "200p

page inside update panel doesn't refresh the session object after postback of any control



I have many controls like dropdown, radiobuttonlist, etc on my page and I put all these controls inside the update panel so that the page doesn't look to be posting back when something is selected. Now the working on the page is very smooth. But the session object isn't getting refreshed even if I postback to the server and as a result even if the users are working on the page they are being sent to the login screen after 20 mins.

Is there anyway where I could put all the controls in update panel and still refresh the session after any postback(dropdown selection)

Any help is greatly appreciated.

Thanks in advance

show / hide jquery modal dialog box on page load



i have a jquery modal dialog box which displays on page load of my asp.net web app - i am using asp.net aspx pages and c#

how can i hide this pop up if a value for example is false and display it if a value is true?

the following is my jquery code:

$(function() {


modal: 'true',

title: 'title'



any advise would be much appreciated as i am new to jquery and its quite a learning curve

many thanks


Maintain Scroll position on postback in a asp:panel?


Hi, I'm having a lot of trouble figuring this out. I'm unable to hold the scroll position in the postback in a panel that I set up with a gridview. I tried some of the links offered in the previous threads and it still doesn't seem to be working. Here's the code I have so far, maybe I am missing something small.

<asp:Panel runat="server" ScrollBars="Vertical" 
                 scrollPOS="<%=saveScrollPos.value %>"
                 style="BEHAVIOR: url(<%=ResolveURL('../Includes/ScrollPos.htc')%>); WIDTH: 4000px; HEIGHT: 1000px" >
                 <input id="saveScrollPos" type="hidden" runat="server" name="saveScrollPos"/>
                   <asp:MultiView ID="MultiView1" runat="server">
                    <asp:View ID="View1" runat="server">


Here is the behavior file It points to:

<PUBLIC:ATTACH EVENT=ondocumentready ONEVENT="elementLoad()" />

// DHTML behavior for scrollable

Hide/Show placeHolder with checbox (jQuery)



Placeholder visibility is set to false (in the code I will paste bellow it's set to visible). When users clicks checkbox the place holder will appear. If uncheck the checked checkbox the place holder would become invisible.

I wanted to help myself with the similar case found here: http://www.scribd.com/doc/36505521/51-Recipes-jquery-aspnET-controls#outer_page_52

and one similar on this forum: http://forums.asp.net/p/1509271/3590401.aspx

I think that this would be quite easy but guess my experimentation with code brings no posititve results and also the fact that I probably have enough of coding for this day. :)

The code (I'm also using fancy checkbox plugin - Safari style):

<script type="text/javascript">
        $(document).ready(function() {
        $('[id$=chckBoxGrp]').checkbox({ cls: 'jquery-safari-checkbox' });
        //not working
        $('[id$=chckBoxGrp]').find('input:checkbox').click(function() {
            if ($('[id$ = chckBoxGrp]').is(":checked")) {

Show/Hide html button using jQuery not working in Firefox


I am stuck with a strange problem, which I am not able to figure out any logical reason behind it. The code given below works perfectly fine in IE 6.

    <form id="form1" runat="server">
    <a href="#" id="aShow">Show Text</a> <a href="#" id="aHide">Hide Text</a>
    <button id="ShowDiv">Show Div</button>
    <button id="HideDiv">Hide Div</button>
    <div id="dvText">
            Password Policy</h3>
            <li>Password should be a minimum of 6 Characters</li>
            <li>Password should contain both upper case and lower case characters</li>
            <li>Password should be a combination of both alpha and numeric</li>

Even the anchor links aShow and aHide works in Firefox (I am using version 3.6.12) but for some weird reason I can't get the button controls to show/hide the divText. The exact problem is when I click the "Show Div" button I can actually see the dvText div for few milli seconds but then it dissappears. Is this a bug in Firefox or am I doing anything wrong I have no idea..

Show Hide Panel Using Ajax


Hello, is there a way to hide/show a panel in my .Net 4 VB web app based on a dropdown selection?

Thanks in advance!

jQuery $(document).ready() and ASP.NET Ajax asynchronous postback

Many call it the ASP.NET jQuery postback problem, but using the technique below should make it no problem anymore. $(document).ready() isn't called after an asynchronous postback. What this means? You lose the functionality that should be executed within $(document).ready() after an UpdatePanel rendered its contents after an asynchronous postback.

jQuery live() and ASP.NET Ajax asynchronous postback

The issue is that normally $(document).ready() is called when the DOM is ready to be manipulated. But this doens't happen after an ASP.NET Ajax asynch postback occurs.

This means that the initial jQuery bindings won't be automatically available after the asynchronous postback is over. I underline "automatically" here because my last post describes more possibilities, how this issue can be worked around.

Maintain HTML Radio Button Selection Inside GridView After Postback

Long time ago I wrote an article about getting the value of the selected RadioButtons inside the GridView control. The code did not addresssed the postback issue which means that the selected radio button was cleared after the postback occurs.

Ajax Asyncfileupload doesn't work as soon as I put it in a control


Hi guys,

I can't get my <ajax:asyncfileupload> working and I don't see why...

When outside any panel or table it is working well, but as soon as I put it in a <asp:panel> or table I get a strange error which seems to be on client-side but I don't understand what's happen here. Here is the code and code-behind and Javascript.

Here's the error: 


Here's my front-code:

<%@ Page Language="VB" MasterPageFile="~/masterpages/mpSqueletton.master" AutoEventWireup="false" CodeFile="frmAdmGestSocietes.aspx.vb" Inherits="adm_frmAdmGestSocietes" title="Untitled Page" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajax" %>

<asp:Content ID="Content1" ContentPlaceHolderID="cphHead" Runat="Server">
<script type="text/javascript" language="javascript">    
        function uploadError(sender,args)
          document.getElementById("<%= lblStatus.ClientID %>").innerText = args.get_fileName(), "<span style='color:red;'>" + args.get_errorMes

ASP Development Server doesn't appear to execute JQuery?


Experienced a really strange problem today. I added a jquery script to my MVC application to collapse sections of a View (via divs).

Pretty standard stuff, he showed me the script working before hand and it works.

However any time I would run my MVC app via Visual Studio the script would not work. I changed browsers, re-imported the code from source control and basically me and my co-worker banged our heads together for some time trying to figure out why the exact same code was running different on two machines.

Publishing the MVC app to our web server and running worked for both machines but for some bizarre reason when I ran it on my VS it never did.

One thought that came to mind is that by VS uses the cassini default lightweight webserver for debugging, whereas my co-worker is using IIS.

This seems to suggest then that the ASP Development server does not support JQuery. Is this true and if not, what could the problem be?

ASP.NetWindows Application  .NET Framework  C#  VB.Net  ADO.Net  
Sql Server  SharePoint  Silverlight  Others  All   

Hall of Fame    Twitter   Terms of Service    Privacy Policy    Contact Us    Archives   Tell A Friend