Controlling ajax updates with tabstrip, multipage and user controls

4 posts, 0 answers
  1. Paul
    Paul avatar
    47 posts
    Member since:
    Dec 2008

    Posted 02 Dec 2012 Link to this post

    I have a master page containing a Treeview used as a menu, and a content area for the site pages. One site page has a summary-style RadGrid at the top of the page, and then a tabstrip with a Multiview. Each PageView contains a user control with the content for that PageView. I am unable to get the correct ajax behavior.

    When I follow what I understand to be Telerik's guidance and list the tabview and multipage each as ajax initiators and updated controls, client-side validation breaks in all the page views. I could live with that, but one of the page view user controls contains a RadEditor, and whatever breaks the client-side validation also results in updated editor content not being saved when the rest of the page data is saved. Watching the server-side validation function for the custom validator assigned to the RadEditor always shows the original editor content and never shows the updated content. Maybe some necessary Javascript for the editor content retrieval is breaking, along with the client-side validation javascript? The client-side validation breaks in IE, Firefox and Chrome. The failure to update the RadEditor content only happens in IE.
    <telerik:RadAjaxManagerProxy ID="RadAjaxManagerProxyTopic" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadTabStripTopic">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadTabStripTopic" />
                    <telerik:AjaxUpdatedControl ControlID="RadMultiPageTopicSubforms" LoadingPanelID="RadAjaxLoadingPanel_Topic" />
                    <telerik:AjaxUpdatedControl ControlID="userMessageDisplay" />
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="RadMultiPageTopicSubforms">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadTabStripTopic" />
                    <telerik:AjaxUpdatedControl ControlID="RadMultiPageTopicSubforms" LoadingPanelID="RadAjaxLoadingPanel_Topic" />
                    <telerik:AjaxUpdatedControl ControlID="RadGridTopic" />
                    <telerik:AjaxUpdatedControl ControlID="userMessageDisplay" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManagerProxy>

    If I remove the RadAjaxManagerProxy and instead surround the page's content with an AspPanel, client-side validation resumes working. Since the user controls on each PageView contain RadGrid controls, I need to ajaxify each of the user controls individually. That works- the client-side validation works, and the user control with the RadEditor successfully saves the updated editor content.

    But since each user control is now individually ajaxified, the main page's summary RadGrid does not get updated when it should. Each user control raises an update event which is handled by the main page. I tried dynamically adding an ajax update for the summary RadGrid, but I get an internal error in Telerik Javascript when the code executes. This is the update event handler on the main page, which tries to assign the desired AjaxSetting. The rest of the event handler performs the appropriate updates to the main page's summary RadGrid, but the .AddAjaxSetting throws an internal exception.
    protected void TopicTabForm_AfterUpdate(object sender, EventArgs e)
    {
         RadAjaxManager ajaxManager = RadAjaxManager.GetCurrent(Page);
         ajaxManager.AjaxSettings.AddAjaxSetting(sender as Control, this.RadGridTopic);

    Is there any way to force a control on the main page to update it's display like this? Or is there any better approach to ajaxifying a tabstrip containing user controls with RadGrids?
  2. Angel Petrov
    Admin
    Angel Petrov avatar
    1006 posts

    Posted 05 Dec 2012 Link to this post

    Hello Paul,

    A better approach would be to wrap the RadTabStrip and RadMultiPage in an ASP:Panel and set the panel to update itself and to update the summary RadGrid. Thus you will not have to set up manually all the RadAjaxManager settings. You should note that when the page uses ValidationSummary control with CustomValidator which performs server-side validation, you need to wrap it in an ASP:Panel and add the panel to the UpdatedControls collection in the ajax settings when the page is ajaxfied with RadAjaxManager. Additionally please ensure that you do not have a JavaScript error on the page which breaks the functionality. Hope my suggestion helps you resolve the problem. If the issue persist please send us your markup so could give you a more straight-forward approach.

    Kind regards,
    Angel Petrov
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Paul
    Paul avatar
    47 posts
    Member since:
    Dec 2008

    Posted 06 Dec 2012 Link to this post

    Thanks Angel. As suggested I put an asp:Panel around the RadTabStrip and RadMultiView. I set the panel as the ajax initiator, with the ajax targets being the panel itself and the summary RadGrid that is outside the panel.

    When a PageView contains a user control which has script, that script does not appear to get loaded. I get a runtime error that the client-side event handler function cannot be found. When I eliminate the Panel and the RadAjaxProxy, that same user control works correctly. I'm guessing the broken script is what causes the rest of the script on the page (client-side validation and updating the RadEditor contents) to fail, and I think there may be other script issues that I am not finding but that cause the same problem even when I omit that particular user control from the MultiView.

    Is there something special I need to do to get a user control's script to load when it's inside a RadMultiView? Or any other script?
  5. Angel Petrov
    Admin
    Angel Petrov avatar
    1006 posts

    Posted 11 Dec 2012 Link to this post

    Hi Paul,

    There are some ajax scenarios in which the scripts may not load correctly. A workaround for this problem is to wrap the script block into RadScriptBlock. If the problem persists you should register the script through the ScriptManager.RegisterStartupScript() method:
    ASPX:
    <telerik:RadScriptBlock Id="RadScriptBlock1" runat="server">
    <script type="text/javascript">
    //your code here
    </script>
    </telerik:RadScriptBlock>
    Code behind:
    protected void Page_Load(object sender, EventArgs e)
    {
        ScriptManager.RegisterStartupScript(Page, typeof(Page), "dynamicScript", "function doSomething(){alert(1);}");
    }
    Other than that I do not see a reason that can cause this behavior. If this does not resolve the problem I would ask you to open a formal support ticket with a project attached so we could investigate more thoroughly.

    Kind regards,
    Angel Petrov
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top