I have two update panels on a page. And I want to update both of them conditions at different-2 conditions. But I don't know why this is not happening. I have specified triggers for both but not helpful, below is my code.
Please let me know Where I am wrong.
Actually there are three dropdown lists in first update panel when their selectedindexchange is fired then the second update panel's content also updates.
<asp:UpdatePanel ID="upSearch" runat="server" ChildrenAsTriggers="true" UpdateMode="Conditional">
<ContentTemplate>
<div style="float: left; width: auto;">
<asp:DropDownList ID="ddlLocation" runat="server" Width="206px" DataTextField="LocationName"
DataValueField="Locationid" AutoPostBack="true" OnSelectedIndexChanged="ddlLocation_SelectedIndexChanged">
</asp:DropDownList>
<asp:DropDownList ID="ddlArea" runat="server" Width="200px" DataTextField="AreaName"
DataValueField="Areaid" AutoPostBack="true" OnSelectedIndexChanged="ddlArea_SelectedIndexChanged">
</asp:DropDownList>
<asp:DropDownList ID="ddlRoom" runat="server" Width="200px" DataTextField="RoomName"
DataValueField="Roomid">
</asp:DropDownList>
</div>
<div style="float: left; width: 80px;">
<asp:Button ID="btnSearch" runat="server" Text="Search" ValidationGroup="vgSearch"
CssClass="bluebtn" UseSubmitBehavior="false" OnClick="btnSearch_Click" />
</div>
<div style="float: left; width: 99%; padding: 5px 0px;">
</div>
</ContentTemplate>
</asp:UpdatePanel>
And the second one is as follow:-
<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="true" UpdateMode="Conditional">
<ContentTemplate>
<asp:Calendar ID="calSchedule" runat="server" NextPrevFormat="FullMonth" OnDayRender="calSchedule_DayRender"
OnVisibleMonthChanged="calSchedule_VisibleMonthChanged">
<DayHeaderStyle CssClass="dayheaderStyle" />
<NextPrevStyle />
<OtherMonthDayStyle BackColor="#ffffff" />
<SelectedDayStyle />
<TitleStyle CssClass="titleStyle" />
<TodayDayStyle BackColor="#ffffa0" ForeColor="#6699cc" />
<WeekendDayStyle />
<DayStyle CssClass="dayStyle" />
</asp:Calendar>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnSearch" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
First of all I would like to recall the use of UpdateMode
Always The panel will update its content on every post on the page, they can be partial rendering posts or full posts, in both cases the content of the panel will be updated
Conditional The content of the panel will only be updated when different conditions are met:
By default the events triggered by its child objects will trigger an update, you can change this behavior setting ChildrenAsTriggers="false"
When you declare a trigger in the Triggers section of the UpdatePanel
When you explicitly call the UpdatePanel.Update() method
Full page posts will trigger the update
The following code does the following:
Each UpdatePanel is updated when its child controls raise an event
The UpdatePanel 1 named: up1 will be updated only when its child controls raise an event
The UpdatePanel 2 named up2 will be updated when its child controls raise an event
The UpdatePanel 2 named up2 will also be updated when the triggers defined are fired, in this case, when the DropDownList named ddl1OnPanel1 on the UpdatePanel 1 fires its SelectedIndexChanged
The UpdatePanel 2 named up2 will also be updated when the DropDownList named ddl2OnPanel1 on the UpdatePanel 1 raises its SelectedIndexChanged, because in code it explicitly calls: this.up2.Update();
I think that tweaking this code, you could achieve your desired goal, just copy paste it on a new page and run it
Check the following code (see how the labels showing the date are affected in different ways depending on the events raised):
Code Behind
protected void ddl1OnPanel1_SelectedIndexChanged(object sender, EventArgs e)
{
this.lblMessageOnPanel1.Text = "From ddl1 " + DateTime.Now.ToString();
this.calendarOnPanel2.SelectedDate = DateTime.Today.AddDays(1);
this.lblMessageOnPanel2.Text = "From ddl1 " + DateTime.Now.ToString();
}
protected void ddl2OnPanel1_SelectedIndexChanged(object sender, EventArgs e)
{
this.lblMessageOnPanel1.Text = "From ddl2 " + DateTime.Now.ToString();
this.calendarOnPanel2.SelectedDate = DateTime.Today.AddDays(2);
this.lblMessageOnPanel2.Text = "From ddl2 " + DateTime.Now.ToString();
this.up2.Update();
}
ASPX
<asp:ScriptManager runat="server" ID="scriptManager" />
<asp:Button Text="Full Post" runat="server" />
<br />
<asp:UpdatePanel runat="server" ID="up1" UpdateMode="Conditional">
<ContentTemplate>
<asp:DropDownList runat="server" ID="ddl1OnPanel1" AutoPostBack="true" OnSelectedIndexChanged="ddl1OnPanel1_SelectedIndexChanged">
<asp:ListItem Text="text1" />
<asp:ListItem Text="text2" />
</asp:DropDownList>
<br />
<asp:DropDownList runat="server" ID="ddl2OnPanel1" AutoPostBack="true" OnSelectedIndexChanged="ddl2OnPanel1_SelectedIndexChanged">
<asp:ListItem Text="text3" />
<asp:ListItem Text="text4" />
</asp:DropDownList>
<br />
<asp:Label runat="server" ID="lblMessageOnPanel1" />
<br />
<asp:Button ID="Button1" Text="text" runat="server" />
<br />
On every post on Panel 1: <%:DateTime.Now %>
</ContentTemplate>
</asp:UpdatePanel>
<br />
<br />
<asp:UpdatePanel runat="server" ID="up2" UpdateMode="Conditional">
<ContentTemplate>
<asp:Calendar ID="calendarOnPanel2" runat="server" >
<DayHeaderStyle CssClass="dayheaderStyle" />
<NextPrevStyle />
<OtherMonthDayStyle BackColor="#ffffff" />
<SelectedDayStyle />
<TitleStyle CssClass="titleStyle" />
<TodayDayStyle BackColor="#ffffa0" ForeColor="#6699cc" />
<WeekendDayStyle />
<DayStyle CssClass="dayStyle" />
</asp:Calendar>
<br />
<asp:Label ID="lblMessageOnPanel2" runat="server" />
<br />
On every post On Panel 2: <%:DateTime.Now %>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="ddl1OnPanel1" EventName="SelectedIndexChanged" />
</Triggers>
</asp:UpdatePanel>
Simple Output
You could change the UpdateMode="Always" on the UpdatePanel 2, to see the difference, if you do it, this panel will be updated on every post, either full posts or posts coming from the UpdatePanel1
I used this successfully for 4 updatepanel.
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" EnableScriptGlobalization="true" CombineScripts="false" ScriptMode="Release">
</asp:ToolkitScriptManager>
Remove the Autopostback="True" from the DropdownLists if you want an asyncpostback to happen.
Also, what exactly is wrong at the moment? The updatepanels don't update at all?
EDIT. Also remove childrenAsTriggers as it is not needed at this occasion
If you are using nested update panels refer below sample code:
<asp:UpdatePanel id="UpdatePanel1" UpdateMode="Conditional" runat="server">
<ContentTemplate>
<fieldset>
<legend>Parent UpdatePanel</legend>
Last refresh <%=DateTime.Now.ToString() %> <br />
<asp:Button ID="Button1" runat="server" Text="Refresh Outer Panel" />
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<fieldset>
<legend>Nested UpdatePanel</legend>
Last refresh <%=DateTime.Now.ToString() %> <br />
<asp:Calendar ID="Calendar1" runat="server"></asp:Calendar>
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
If not using nested update panels then remove "UpdateMode" conditions from both Updatepanels of your code.
Related
So, I have this update panel:
<asp:UpdatePanel runat="server" RenderMode="Inline" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnSubmit" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="ddOutcomeType" />
<asp:AsyncPostBackTrigger ControlID="ddOutcomeCode" />
</Triggers>
<ContentTemplate>
<fieldset>
<asp:DropDownList ID="ddOutcomeType" runat="server" AutoPostBack="True"
OnSelectedIndexChanged="ddOutcomeType_OnSelectedIndexChanged">
<asp:ListItem Value="0">Please Select...</asp:ListItem>
<asp:ListItem Value="EDU">Continuing in Education</asp:ListItem>
<asp:ListItem Value="EMP">Paid Employment</asp:ListItem>
<asp:ListItem Value="NPE">Not in Paid Employment</asp:ListItem>
<asp:ListItem Value="GAP">Gap Year</asp:ListItem>
<asp:ListItem Value="OTH">Other</asp:ListItem>
</asp:DropDownList>
<asp:DropDownList ID="ddOutcomeCode" runat="server" DataTextField="COMPDESC"
DataValueField="EBSVALUE"
OnSelectedIndexChanged="ddOutcomeCode_OnSelectedIndexChanged"
AutoPostBack="True" Visible="false" />
<br /><br />
<asp:Label ID="lblDestMessage" runat="server"
Text="Please start typing at least 3 characters of the HE institute
then select from the list (Don't make your own up!)"
Visible="false">
</asp:Label>
<h4 style="align-content:center;">
<asp:Label ID="Label1" runat="server" Text="Comments on Destination">
</asp:Label></h4>
<asp:TextBox ID="txtDestComments" runat="server" Width="70%"></asp:TextBox>
<br />
<asp:RegularExpressionValidator ID="validJust" runat="server"
Display="Dynamic" ControlToValidate="txtDestComments"
ValidationExpression="^([\S\s]{0,249})$" CssClass="label label-danger"
ErrorMessage="Please enter maximum 250 characters"
SetFocusOnError="True">
</asp:RegularExpressionValidator>
<br />
<asp:Button ID="btnSubmit" runat="server" Text="Submit"
CssClass="btn btn-primary" OnClick="btnSubmit_OnClick" />
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
I Have looked at other questions for the same problem but none of the fixes work for this, i tried putting the button outside of the update panel but then the Hidden Fields that are changed by the dropdown lists dont stay changed outside of the update panels.
Any Help?
You are using UpdateMode property of update panel as UpdateMode="Conditional". Either you have to explicitly use Update() method of update panel in button Click event on server side to update the content inside update panel or remove this UpdateMode property because by default it is set as Always.
My problem is that I can't seem to get my textbox to fire the OnTextChanged event. I also checked and it doesn't seem like it is doing an autopostback despite the fact that it is set to true.
Basically, I am trying to validate the text in the textbox and either enable or disable a button based on the validation status.
Here's my code:
<asp:Panel ID="panelAccessControl" runat="server" Visible="false">
<asp:Panel ID="panelAddMileageRate" runat="server" BorderWidth="2" >
<h2>Add Mileage Rate</h2>
<asp:ScriptManager ID="scriptManagerMileageRate" runat="server" />
<asp:UpdatePanel ID="updatePanelAddMileageRate" runat="server">
<ContentTemplate>
<p>
Purpose:
<asp:DropDownList ID="ddlAddPurpose" runat="server"
AutoPostBack="true" Width="200px"></asp:DropDownList>
<br />
Country:
<asp:DropDownList ID="ddlAddCountry" runat="server"
AutoPostBack="true" Width="200px" >
</asp:DropDownList>
<br />
Effective Date:
<asp:Calendar ID="calAddEffectiveDate" runat="server">
</asp:Calendar>
<br />
Mileage Rate:
<asp:TextBox ID="txtAddMileageRate" runat="server"
AutoPostBack="true" Width="200px"
CausesValidation="true"
ontextchanged="txtAddMileageRate_TextChanged">
</asp:TextBox>
<asp:RegularExpressionValidator
ID="validatorAddMileageRate"
ControlToValidate="txtAddMileageRate" runat="server"
SetFocusOnError="true"
ErrorMessage="Only Numbers allowed"
ValidationExpression="^\d{1,20}(\.\d{0,4})?$">
</asp:RegularExpressionValidator>
</p>
</ContentTemplate>
</asp:UpdatePanel>
<p>
<asp:Button ID="buttonAddSecurityGroup" runat="server"
Text="Submit" onclick="buttonAddSecurityGroup_Click" />
</p>
</asp:Panel>
<asp:Label ID="lblStatus" runat="server" Text=""></asp:Label>
</asp:Panel>
The text box in question is txtAddMileageRate.
Set the EventName property for your txtAddMileageRate AsyncPostBackTrigger to TextChanged.
Add following codes inside your update panel and outside of ContentTemplate
<Triggers>
<asp:AsyncPostBackTrigger ControlID="txtAddMileageRate"
EventName="TextChanged" />
</Triggers>
Other sugguestion:
Have you tried looking at the AutoComplete (http://www.asp.net/ajax/ajaxcontroltoolkit/samples/autocomplete/autocomplete) control that is part of the AjaxControlToolKit? Its behaves the same way you want your solution to behave.
I think I've tried every combination possible with update panels and I just cant seem to get this to work. I've got an update panel like so:
<asp:UpdatePanel runat="server" ID="upParent" UpdateMode="Conditional" ChildrenAsTriggers="False">
<ContentTemplate>
Some content...
<div style="width:100%;text-align:center;">
<asp:Label ID="lblMainMessage" runat="server"></asp:Label>
<asp:UpdateProgress AssociatedUpdatePanelID="upParent" ID="UpdateProgress7" runat="server" DisplayAfter="100" DynamicLayout="True" Visible="True">
<ProgressTemplate>
<div class="loader ui-widget-overlay">
Loading data, please wait...<br/><img style="border-style:none;" src="../../Images/ajax-loader.gif" alt="loading" />
</div>
</ProgressTemplate>
</asp:UpdateProgress>
</div>
<div>
<asp:UpdatePanel runat="server" ID="upChild" UpdateMode="Conditional" ChildrenAsTriggers="False">
<ContentTemplate>
<asp:Timer ID="timerChecklists" runat="server" OnTick="TimerChecklistsTick" Interval="10000"></asp:Timer>
<asp:GridView ID="gvChecklists" runat="server"
AutoGenerateColumns="False" >
<Columns>
<ItemTemplate>
<asp:TemplateField HeaderText="Ques. Ans. Yes">
<ItemTemplate>
<asp:Label ID="lblQuestionsAnsweredYes" runat="server" ForeColor="Green"
Text='<%# DataBinder.Eval(Container, "DataItem.QuestionYesAnswered") %>'
ToolTip="Questions answered Yes."></asp:Label>
</ItemTemplate>
<FooterStyle HorizontalAlign="Center" />
<HeaderStyle HorizontalAlign="Center" />
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Ques. Ans. No">
<ItemTemplate>
<asp:Label ID="lblQuestionsAnsweredNo" runat="server" ForeColor="Red"
Text='<%# DataBinder.Eval(Container, "DataItem.QuestionNoAnswered") %>'
ToolTip="Questions answered No."></asp:Label>
</ItemTemplate>
<FooterStyle HorizontalAlign="Center" />
<HeaderStyle HorizontalAlign="Center" />
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Ques. Ans. N/A">
<ItemTemplate>
<asp:Label ID="lblQuestionsAnsweredNA" runat="server" ForeColor="Gray"
Text='<%# DataBinder.Eval(Container, "DataItem.QuestionNAAnswered") %>'
ToolTip="Questions answered N/A."></asp:Label>
</ItemTemplate>
<FooterStyle HorizontalAlign="Center" />
<HeaderStyle HorizontalAlign="Center" />
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
</Columns>
</asp:GridView>
<asp:Image ID="imgLoader" runat="server" ImageUrl="/Images/ajax-loader.gif" />
</td>
</tr>
</table>
</div>
<div style="width:100%;text-align:center;">
<asp:Label ID="lblspChecklists2" runat="server"></asp:Label>
</div>
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="btnChecklistExcel"/>
<asp:AsyncPostBackTrigger ControlID="timerChecklists" />
</Triggers>
</asp:UpdatePanel>
What I am trying to accomplish is to sort of lazy load some gridview data due to its size. So what I simply did is wrap the gridview inside an update panel. I then place a timer within this update panel and set it to 10000 (10 seconds) for the tick event. I set the event OnTick as shown:
protected void TimerChecklistsTick(object sender, EventArgs e)
{
LoadChecklistsSubPanel();
timerChecklists.Enabled = false;
imgLoader.Visible = false;
}
The LoadChecklistsSubPanel simply gets a dataset and assigns it to the grid views datasource and does a databind. This all works fine...however my issue is the following:
Note as mentioned a parent update panel and a child update panel. Within this I have an Update progress associated to the update panel upParent. But my issue is when the 10 seconds hits and the timer event is fired this updateprogress is shown (in effect causing my entire page to basically load). I would think that this would not happen given the updatemode is condition and children as triggers is false.
I have also tried ChildrenAsTriggers=true, I've tried to make the update panel mode always, I've tried just about everything but my issue still persists. Right when 10 seconds hits the UpdateProgress (which shows a loading data, please wait overlay is displayed.
Other than that my grid view is getting binded correctly, its getting its data after 10 seconds, etc. My only issue is I cannot seem to understand why the UpdateProgress shows up and overlays my entire screen if all that is happening is my nested sub panel should be updating only.
The fact is that upPanel not updated, you can check this by putting a Label in the upPanel with value="0" and add lblTest.text +=1 under TimerChecklistsTick in codebehind.
you can see that the value don't have any change.
In fact the problem is UpdateProgress control, UpdateProgress control is not a powerful tool and your expectations should not be very high.
if you want a powerful and customizable UpdateProgress you shoud make your own using JavaScript:
<script type="text/javascript">
var postBackElement;
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_initializeRequest(InitializeRequest);
prm.add_endRequest(EndRequest);
function InitializeRequest(sender, args) {
postBackElement = args.get_postBackElement();
if (prm.get_isInAsyncPostBack()) {
args.set_cancel(true);
} else {
//Put your progress UI here
//Check Trigger Id if needed.
//Show an image or Hide another div or ...
}
}
function EndRequest(sender, args) {
}
</script>
But Solution ...
But i was played a little with your code and found that if you remove your timer from inside UpdatePanels and put it outside them totally, your problem will be solved.
</ContentTemplate>
</asp:UpdatePanel>
//Outside the upParent
<asp:Timer ID="timerChecklists" runat="server" OnTick="TimerChecklistsTick" Interval="10000"></asp:Timer>
The problem is persist for any control that placed inside child updatepanels.
i don't know if there are a basis solution or not but as i say UpdateProgress is a simple and quick solution but not good in performance and flexibility totally.
Update
This is simulated code what work for me (ASP.NET 4.5, Chrome 36):
<%# Page Language="vb" AutoEventWireup="false" CodeBehind="Default2.aspx.vb" Inherits="StackOverflowTests_WebVB.net.Default2" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel runat="server" ID="upParent" UpdateMode="Conditional" ChildrenAsTriggers="False">
<ContentTemplate>
<asp:Label ID="lbl1" runat="server" Text="0"></asp:Label>
<asp:UpdateProgress AssociatedUpdatePanelID="upParent" ID="UpdateProgress7" runat="server" DisplayAfter="100" DynamicLayout="True" Visible="True">
<ProgressTemplate>
<div class="loader ui-widget-overlay">
Loading data, please wait...<br />
<img style="border-style: none;" src="../Images/loading.gif" alt="loading" />
</div>
</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel runat="server" ID="upChild" UpdateMode="Conditional" ChildrenAsTriggers="False">
<ContentTemplate>
<asp:Label ID="lbl2" runat="server" Text="0"></asp:Label>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="timerChecklists" />
</Triggers>
</asp:UpdatePanel>
</ContentTemplate>
</asp:UpdatePanel>
<asp:Timer ID="timerChecklists" runat="server" OnTick="TimerChecklistsTick" Interval="1000"></asp:Timer>
</div>
</form>
</body>
</html>
CodeBehind:
Protected Sub TimerChecklistsTick(sender As Object, e As EventArgs)
lbl1.Text += 1
lbl2.Text += 1
End Sub
In output, lbl2 start counting without full postback and without showing the content of UpdateProgress on every Tick.
If you move Timer inside the upChild, you can see that content of UpdateProgress will be shown on evey Tick, but still lbl1 show 0 without any change.
I am working on asp.net application and I have an update panel like this:
<asp:UpdatePanel ID="upCheckout" runat="server">
<ContentTemplate>
<!-- BillingAddress -->
<div runat="server" id="pnlBillingAddress" class="checkoutstep">
<asp:Panel runat="server" ID="pnlBillingAddressContent" class="stepcontent">
<nopCommerce:CheckoutBillingAddress ID="ctrlCheckoutBillingAddress" runat="server"
OnePageCheckout="true" OnCheckoutStepChanged="ctrlCheckoutBillingAddress_CheckoutStepChanged" />
<asp:CheckBox ID="chkShippingSameAsBilling" runat="server" Text=" Ship to same address"
AutoPostBack="true" Checked="true" onclick="ShowShippingAddress();" /><br />
</asp:Panel>
</div>
<!-- ShippingAddress -->
<div runat="server" id="pnlShippingAddress" class="checkoutstep">
<asp:Panel runat="server" ID="pnlShippingAddressContent" class="stepcontent">
<nopCommerce:CheckoutShippingAddress ID="ctrlCheckoutShippingAddress" runat="server"
OnePageCheckout="true" OnCheckoutStepChanged="ctrlCheckoutShippingAddress_CheckoutStepChanged" />
</asp:Panel>
</div>
</ContentTemplate>
</asp:UpdatePanel>
where billing address is a user control. In billing address control, There is a dropdownlost. like this:
<asp:DropDownList ID="drpBillingAddresses" ClientIDMode="Static" runat="server" AutoPostBack="True" OnSelectedIndexChanged="drpBillingAddresses_SelectedIndexChanged">
</asp:DropDownList>
but when I change dropdown selection, I get full post back instead of partial postback. why I am getting full postback ?
Register the OnSelectedIndexChanged event as asynchronous by setting Triggers property of UpdatePanel.
Frens,
i have a textbox with ajaxToolkit:CalendarExtender which losses data when i chose radio buttons ....
please read my code...
<asp:UpdatePanel ID="uppnl_Select_File_Format" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<div class="input-field-box-container">
<asp:TextBox ID="txtExpiryDate" runat="server"
SkinID="FormInputTextBox" ReadOnly="true"
ValidationGroup="PublishUser"> </asp:TextBox>
<ajaxToolkit:CalendarExtender ID="ajax_Expiry_Date" runat="server" TargetControlID="txtExpiryDate">
</ajaxToolkit:CalendarExtender>
</div>
<div class="input-field-box-container">
<asp:RadioButton ID="rbtnEnabled" GroupName="Print" Text="Enable" runat="server"
AutoPostBack="true"
OnCheckedChanged="rbtnEnabled_CheckedChanged" CssClass="checkbox-auto"
Width="220px" />
<asp:RadioButton ID="rbtnDisabled"
GroupName="Print" Text="Disable" runat="server"
AutoPostBack="true" OnCheckedChanged="rbtnDisabled_CheckedChanged" CssClass="checkbox-auto"
Width="220px" />
</div>
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="btnCreate" />
<asp:AsyncPostBackTrigger ControlID="ajax_Expiry_Date" />
</Triggers>
</asp:UpdatePanel>
Your radioButton's AutoPostback attribute(or what it is called) is true that means when you change the choice of radio button the page will post back and which will cause to refresh the UpdatePanel.As long as your radio button and CalenderExtender is on the same UpdatePanel every time OnCheckedChanged="rbtnDisabled_CheckedChanged" works CalenderExtender will loose data.
Well you can understand that your solution is using different UpdatePanels for those RadioButtons and CalenderExtenders.
The solution I arrived at was to remove ReadOnly="true".