Telerik Forums / UI for ASP.NET AJAX
This is a migrated thread and some comments may be shown as answers.

Usercontrol fails to retain viewstate values for input controls between postbacks in RadAjaxPanel

4 Answers 197 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Bryan
Top achievements
Rank 1
Bryan asked on 03 May 2016, 05:41 AM

Recently I ran into a strange issue where my usercontrols, when there are two or more of them managed by ajaxToolkit:ModalPopupExtender nested in another usercontrol, in RadAjaxPanel would lose input values between postbacks. There is no such issue with any other controls outside or the usercontrol parenting the problematic usercontrols. 

As a revelation of my debugging attempts setting one of the problematic controls to visible false (and set it back to visible when they are supposed to appear in the modal popup) would solve this issue.

Here is my code:

Problematic controls:

01.<asp:Panel ID="FileDefinitionEdit" CssClass="sbpopup" style="display:none"  runat="server"    >
02.                                
03.              
04.                                         <div class="popupholder" style="width:1000px">
05.        <uc3:FileDefinitionEdit ID="FileDefinitionEditAscx" runat="server"  visible="false"  />
06.                                             <div class="popbuttonarea">  <asp:Button ID="Button5"  OnClick="Button5_Click" CssClass="btn btn-primary btn-sm"  runat="server" Text="Insert"  />
07.                        <asp:Button ID="Button6" CssClass="btn btn-primary btn-sm"   OnClick="Button6_Click"   runat="server" Text="Cancel" /></div>
08.                                </div>
09. 
10.                              
11.    </asp:Panel>
12. 
13. <asp:Panel ID="ConnectionStringEdit" CssClass="sbpopup"  style="display:none"  runat="server"   >
14.                                
15.                                     
16.                                         <div class="popupholder" style="width:1000px">
17.        <uc2:ConnectionStringEdit ID="ConnectionStringEditAscx" runat="server"   Visible="false"   />
18.                                             <div class="popbuttonarea">  <asp:Button ID="Button4"  OnClick="Button4_Click" CssClass="btn btn-primary btn-sm"  runat="server" Text="Insert" />
19.                        <asp:Button ID="Button3" CssClass="btn btn-primary btn-sm"   OnClick="Button6_Click"   runat="server" Text="Cancel" /></div>
20.                                </div>
21. 
22.         
23.                                         
24.    </asp:Panel>
25. 
26. 
27.    
28.    <asp:Button ID="MPECTRL_Button"  CssClass="hiddenControl"   runat="server" Text="Button" />
29. 
30.    <ajaxToolkit:ModalPopupExtender  ID="PopupInsert_ModalPopupExtender" runat="server" TargetControlID="MPECTRL_Button"    PopupControlID="ConnectionStringEdit"      /> 
31.                           

 

Parent control of the problematic controls:

1.<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="ProcessesControl.ascx.cs"   Inherits="BizData.Perspective.DataGovernor.Controls.ProcessesControl" %>
2.<%@ Register Src="ParametersControl.ascx" TagName="ParametersControl" TagPrefix="uc1" %>
3.<%@ Register Src="ConnectionStringEdit.ascx" TagName="ConnectionStringEdit" TagPrefix="uc2" %>
4.<%@ Register Src="FileDefinitionEdit.ascx" TagName="FileDefinitionEdit" TagPrefix="uc3" %>
5. 
6.<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit"  %>
7. 
8....

 

Master Page:

01.//Header
02....
03.<body style="margin: 0px; height: 100%; overflow: hidden;">
04.    <form id="Form1" runat="server">
05.        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
06.        </telerik:RadScriptManager>
07.        <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" />
08.        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel2">
09.            <AjaxSettings>
10.                <telerik:AjaxSetting AjaxControlID="RadAjaxPanel1">
11.                    <UpdatedControls>
12.                        <telerik:AjaxUpdatedControl ControlID="RadAjaxPanel1" LoadingPanelID="RadAjaxLoadingPanel2" />
13.                    </UpdatedControls>
14.                </telerik:AjaxSetting>
15.            </AjaxSettings>
16.        </telerik:RadAjaxManager>
17.//Where all contents and controls reside:
18.        <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" Width="100%" Height="100%">
19. <telerik:RadSplitter ID="RadSplitter1" runat="server" Orientation="Horizontal" BorderStyle="None"
20.                BorderSize="0" LiveResize="true" Width="100%" Height="100%" RegisterWithScriptManager="true"
21.                RenderMode="Lightweight" >
22. <telerik:RadPane ID="rpHeader" runat="server" BorderStyle="None" BorderWidth="0"
23.                    Height="45px" CssClass="visibleOverflow">
24....
25.   </telerik:RadPane>
26.            </telerik:RadSplitter>
27. 
28.        </telerik:RadAjaxPanel>
29. 
30.        <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel2" runat="server" Transparency="10">
31.            <div class="loading" style="text-align: left; padding-top: 45px; padding-left: 98%">
32.                <asp:Image ID="Image2" runat="server" ImageUrl="images/loading1.gif" AlternateText="loading.."
33.                    Width="16px" Height="16px" />
34.            </div>
35.        </telerik:RadAjaxLoadingPanel>
36....
37.//Datasources and footer

My wild guess would be too many usercontrols would exceed the viewstate capacity of some sort, resulting their input values to be truncated between postbacks.

Any ideas?

4 Answers, 1 is accepted

Sort by
0
Bryan
Top achievements
Rank 1
answered on 03 May 2016, 05:46 AM

Forgot to mention I also tried my luck putting the controls in RadAjaxPanel and the issue persisted.

Couldn't get the native UpdatePanel to work either. Got an error "Could not find UpdatePanel with ID" as everything is already encapsulated in the RadAjaxPanel on the master page which causes an conflict.

0
Vasil
Telerik team
answered on 03 May 2016, 12:45 PM
Hi Bryan,

You should either use RadAjaxPanel or configure the RadAjaxManager to update something.

Here is configuration with the manager:
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel2">
  <AjaxSettings>
  <telerik:AjaxSetting AjaxControlID="aspPanel1">
    <UpdatedControls>
      <telerik:AjaxUpdatedControl ControlID="aspPanel1" />
      </UpdatedControls>
    </telerik:AjaxSetting>
  </AjaxSettings>
</telerik:RadAjaxManager>
<asp:Panel runat="server" id="aspPanel1">
  your content
</asp:Panel>

And here is with the UpdatePanel:
<telerik:RadAjaxPanel runat="server" id="RadAjaxPanel1">
  your content
</telerik:RadAjaxPanel>

At this case the both will behave the same. Buttons inside your content will make ajax calls and the content will update without full post back.

However this is not valid configuration, even if it will work in most of the cases, it can cause problems in more complex scenarios:

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
  <AjaxSettings>
  <telerik:AjaxSetting AjaxControlID="RadAjaxPanel1">
    <UpdatedControls>
      <telerik:AjaxUpdatedControl ControlID="RadAjaxPanel1"/>
      </UpdatedControls>
    </telerik:AjaxSetting>
  </AjaxSettings>
</telerik:RadAjaxManager>
 
<telerik:RadAjaxPanel runat="server" id="RadAjaxPanel1">
  your content
</telerik:RadAjaxPanel>

Regards,
Vasil
Telerik
Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
0
Bryan
Top achievements
Rank 1
answered on 05 May 2016, 12:17 AM

 

Hi Vasil,

Thanks for the quick response. However the problem persists despite configuring the Radajaxmanager to manage the Radajaxpanels. Here is the updated code:

Master Page:

...
<body style="margin: 0px; height: 100%; overflow: hidden;">
    <form id="Form1" runat="server">
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
        </telerik:RadScriptManager>
        <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" />
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel2">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="RadAjaxPanel1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadAjaxPanel1" LoadingPanelID="RadAjaxLoadingPanel2" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="FileDefinitionEdits">
    <UpdatedControls>
      <telerik:AjaxUpdatedControl ControlID="FileDefinitionEdits"/>
      </UpdatedControls>
    </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="ConnectionStringEdits">
    <UpdatedControls>
      <telerik:AjaxUpdatedControl ControlID="ConnectionStringEdits"/>
      </UpdatedControls>
    </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
       
        <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" Width="100%" Height="100%">
...

Parent Control:

...
 
<telerik:RadAjaxPanel ID="FileDefinitionEdits" CssClass="sbpopup" style="display:none"  runat="server"    >
                                
              
                                         <div class="popupholder" style="width:1000px">
        <uc3:FileDefinitionEdit ID="FileDefinitionEditAscx" runat="server"    />
                                             <div class="popbuttonarea">  <asp:Button ID="Button5"  OnClick="Button5_Click" CssClass="btn btn-primary btn-sm"  runat="server" Text="Insert"  />
                        <asp:Button ID="Button6" CssClass="btn btn-primary btn-sm"   OnClick="Button6_Click"   runat="server" Text="Cancel" /></div>
                                </div>
 
                              
    </telerik:RadAjaxPanel>
 
 <telerik:RadAjaxPanel ID="ConnectionStringEdits" CssClass="sbpopup"  style="display:none"  runat="server"   >
                                
                                     
                                         <div class="popupholder" style="width:1000px">
        <uc2:ConnectionStringEdit ID="ConnectionStringEditAscx" runat="server"     />
                                             <div class="popbuttonarea">  <asp:Button ID="Button4"  OnClick="Button4_Click" CssClass="btn btn-primary btn-sm"  runat="server" Text="Insert" />
                        <asp:Button ID="Button3" CssClass="btn btn-primary btn-sm"   OnClick="Button6_Click"   runat="server" Text="Cancel" /></div>
                                </div>
 
         
                                         
    </telerik:RadAjaxPanel>
 
...

Input controls in the usercontrols still fail to retain their values between postbacks and the Modalpopupextender disappears after postback so it is even worse... :(

0
Vasil
Telerik team
answered on 09 May 2016, 11:17 AM
Hi Bryan,

I believe you get me wrong in my previous post, since your last code is exactly the non-supported example.
First two options are the valid configurations, and the third is invalid.

You can test it further using asp:UpdatePanels instead of the RadAjaxPanels and remove the manager, to confirm if the problem is inside the manager itself, or in the PopupExtender.

Regards,
Vasil
Telerik
Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Tags
General Discussions
Asked by
Bryan
Top achievements
Rank 1
Answers by
Bryan
Top achievements
Rank 1
Vasil
Telerik team
Share this question
or