This is a migrated thread and some comments may be shown as answers.

RadAjaxManager Masterpage

4 Answers 339 Views

Ajax

This is a migrated thread and some comments may be shown as answers.

Marco Beyer asked on 11 Jul 2011, 03:57 PM

Dear Telerik-Staff,

my scenario looks as follows:

I have a masterpage containing a radtreeview inside a radpanel. This tree stores information about data assigned to a specific user. In one of my content pages (which is nested in the masterpage) I perform an operation in which the data assigned to the above called user is updated.

When this operation success I want to update the radtreeview on the masterpage. Thus, I did the following:

1.)
In the method which updates the data on the content page, I call

((RadAjaxManager)this.Master.FindControl("AjaxManagerMasterPage")).RaisePostBackEvent("MyCustomCommand");

2.)
On the masterpage, I have an AjaxManager (NOT a proxy!) which registers the AjaxRequest-Event:

OnAjaxRequest="AjaxManagerMasterPage_AjaxRequest"

3.)
In the code behind file of the master page I handle the event:

protected void AjaxManagerMasterPage_AjaxRequest(object sender, Telerik.Web.UI.AjaxRequestEventArgs e)

{

if (e.Argument == "MyCustomCommand")

{

//Just an example

mainPanelBar.Items[5].Text = DateTime.Now.ToLongTimeString();

}

4.)
In the markup-file of the masterpage I defined the controls to be ajaxyfied as follows:

<telerik:AjaxSetting AjaxControlID="AjaxManagerMasterPage">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="mainPanelBar" />

<telerik:AjaxUpdatedControl ControlID="anotherControl" />

</UpdatedControls>

</telerik:AjaxSetting>

The event fires as expected, but the tree view on the masterpage isn't ajaxified (updated). Somewhere in the docs I read tht the AjaxManager can only ajaxify controls beneath itself and that controls on the masterpage cannot be ajaxified.

To me, it looks much more as if I made a mistake in the definition of the updated controls for the RadAjaxManager. Or isn't it possible to ajaxify a control on the masterpage even if the AjaxRequest (fired in the content page) is raised as expected in the master page? For example, when I call Response.Redirect in the AjaxRequest-Event, the page redirects to the specified URL.

Best regards,
Marco

4 Answers, 1 is accepted

answered on 14 Jul 2011, 11:09 AM

Hey Lana,

I created a project which includes only the relevant parts ofmy problem (since my solution is a big project and cutting the unnecessary parts out would consum too much time). The project has a masterpage and one content page.

On the masterpage, I have one AjaxManager and on the content page one AjaxManagerProxy. I guess, this is the problem. When I leave the Proxy away, the page reloads (that is visible since the entire page is posted back). Then, the PanelBarItem is updated successfully.

Else, the label on the content page is updated (since this is defined in the ajaxmanagerproxy on the content page), but not the panelbaritem on the master page.

I hope that my sample project is applicable enough to point the problem.

PS: I see that I cannot send my project since the uploader only allows me to upload images. So, here are the contents:

MasterPage.aspx:

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Main.master.cs" Inherits="MasterPageProblem.Main" %>

<%@ Register Assembly="Telerik.Web.UI, Version=2011.1.413.35, Culture=neutral, PublicKeyToken=121FAE78165BA3D4" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

<asp:ContentPlaceHolder ID="head" runat="server">

</asp:ContentPlaceHolder>

</head>

<body>

<form id="form1" runat="server">

<telerik:RadScriptManager runat="server" ID="RadScriptManager1">

</telerik:RadScriptManager>

<telerik:RadAjaxManager ID="AjaxManagerMasterPage" runat="server" OnAjaxRequest="AjaxManagerMasterPage_AjaxRequest">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="AjaxManagerMasterPage">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="mainPanelBar" />

<telerik:AjaxUpdatedControl ControlID="treeView1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadStyleSheetManager runat="server" ID="RadStyleSheet1" />

<telerik:RadFormDecorator runat="server" ID="RadFormDecorator1" DecoratedControls="Default,Zone" />

<telerik:RadSplitter runat="Server" ID="RadSplitter1" Width="100%" BorderSize="0"

BorderStyle="None" PanesBorderSize="0" Height="100%" Orientation="Horizontal"

VisibleDuringInit="false">

<telerik:RadPane ID="topPane" runat="server" Height="74px">

<div class="header">

<div class="logo"></div>

<div class="skin-chooser">

Sample Content

</div>

</telerik:RadPane>

<telerik:RadPane runat="server" ID="contentPane" Scrolling="none">

<telerik:RadSplitter runat="server" ID="someSplitter" BorderStyle="None" PanesBorderSize="0">

<telerik:RadPane runat="Server" ID="leftPane" Width="280px" MinWidth="280" MaxWidth="600" Scrolling="None">

<telerik:RadPanelBar

runat="server" ID="mainPanelBar"

Height="100%"

Width="100%"

ExpandMode="FullExpandedItem">

<Items>

<telerik:RadPanelItem Text="Sample 1" NavigateUrl="#" Enabled="false">

<Items>

<telerik:RadPanelItem Text="Template 1" />

<telerik:RadPanelItem Text="Template 2" />

<telerik:RadPanelItem Text="Template 3" />

</Items>

</telerik:RadPanelItem>

<telerik:RadPanelItem Text="Sample 2" NavigateUrl="#" Enabled="false">

<Items>

<telerik:RadPanelItem Text="Template 1" />

<telerik:RadPanelItem Text="Template 2" />

<telerik:RadPanelItem Text="Template 3" />

</Items>

</telerik:RadPanelItem>

<telerik:RadPanelItem Text="Sample 3" NavigateUrl="#" Enabled="false">

<Items>

<telerik:RadPanelItem Text="Template 1" />

<telerik:RadPanelItem Text="Template 2" />

<telerik:RadPanelItem Text="Template 3" />

</Items>

</telerik:RadPanelItem>

<telerik:RadPanelItem Text="Sample 4" CssClass="panelBar" Expanded="true">

<ContentTemplate>

<asp:Panel ID="panelRadPaneItem" runat="server" ScrollBars="Auto" Height="100%">

<telerik:RadTreeView runat="Server" ID="treeView1" EnableViewState="false" Font-Size="12px">

</telerik:RadTreeView>

</asp:Panel>

</ContentTemplate>

</telerik:RadPanelItem>

</Items>

</telerik:RadPanelBar>

</telerik:RadPane>

<telerik:RadSplitBar runat="server" ID="RadSplitBar1" CollapseMode="Forward" />

<telerik:RadPane runat="Server" ID="rightPane" CssClass="right-pane" Scrolling="Both">

<div class="main">

<asp:ContentPlaceHolder ID="MainContent" runat="server"></asp:ContentPlaceHolder>

</div>

</telerik:RadPane>

</telerik:RadSplitter>

</telerik:RadPane>

</telerik:RadSplitter>

</form>

</body>

</html>

Code behind of MasterPage:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using Telerik.Web.UI;

namespace MasterPageProblem

{

public partial class Main : System.Web.UI.MasterPage

{

protected void Page_Load(object sender, EventArgs e)

{

if (!IsPostBack)

{

RadTreeNode node = new RadTreeNode();

node.Text = "Created dynamically at: " + DateTime.Now.ToLongTimeString();

//Append dynamic node

treeView1.Nodes.Add(node);

}

protected void AjaxManagerMasterPage_AjaxRequest(object sender, Telerik.Web.UI.AjaxRequestEventArgs e)

{

if (e.Argument == "MyCustomCommand")

{

//Do something useful here

mainPanelBar.Items[3].Text = DateTime.Now.ToLongTimeString();

}

Now my content page, the Default.aspx:

<%@ Page Title="" Language="C#" MasterPageFile="~/Main.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="MasterPageProblem.Default" %>

<%@ Register Assembly="Telerik.Web.UI, Version=2011.1.413.35, Culture=neutral, PublicKeyToken=121FAE78165BA3D4" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">

</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

<telerik:RadAjaxManagerProxy ID="RadAjaxManager1" runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="Button1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="lblCurrentTime" UpdatePanelRenderMode="Inline"/>

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManagerProxy>

My content goes here

<br /><br />

<asp:Button ID="Button1" runat="server" Text="Click me to update 'Sample 4' on the MasterPage" OnClick="Button1_Click" />

<asp:Label id="lblCurrentTime" runat="server"></asp:Label>

</asp:Content>

And finally the code behind of the default content page:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using Telerik.Web.UI;

namespace MasterPageProblem

{

public partial class Default : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

}

protected void Button1_Click(object sender, EventArgs e)

{

//Update the prepared projects tree on the masterpage

((RadAjaxManager)this.Master.FindControl("AjaxManagerMasterPage")).RaisePostBackEvent("MyCustomCommand");

//Set current time

lblCurrentTime.Text = DateTime.Now.ToLongTimeString();

}

Happy to hear from you,
best regards,
Maro

Accepted

answered on 20 Jul 2011, 11:34 AM

RadAjaxManagerMasterPage.zip

Hi Marco,

I investigated the case and to make it work you should add a setting where the Button updates the control in the master page. Because in this case the button is the control that invoked the ajax request. And after this request only the controls that are set as UpdatedControls for it will be updated.

Check the attached sample (Default3.aspx page) and let me know how it goes.

Kind regards,
Iana
the Telerik team

Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!