Ajax with RadTabStrip, RadMultiPage and UserControls

[Al]

Hi,

I'm trying to do an ajax update panel in a radtabstrip, radmultipage and user controls, but i can't seem to make it work.

I think it should be easy, but i have to miss something.

My structure :

Default.aspx

<telerik:RadAjaxManager ID="radManager" runat="server" />

<telerik:RadTabStrip ID="rtsSheet" runat="server" MultiPageID="radMultiPage" CausesValidation="false">
          <Tabs>
               <telerik:RadTab PageViewID="rpvTradeName" ToolTip="<%$ Resources: General, TradeNameTitle %>">
                    <TabTemplate>
                        <asp:Literal ID="ltrlTradeName" runat="server" Text="<%$ Resources: General, TradeName %>" />
                    </TabTemplate>
                </telerik:RadTab>
                <telerik:RadTab PageViewID="rpvViewAll" ToolTip="<%$ Resources: General, ViewAll %>">
                    <TabTemplate>
                        <asp:Literal ID="ltrlViewAll" runat="server" Text="<%$ Resources: General, ViewAll %>" />
                    </TabTemplate>
                </telerik:RadTab>
            </Tabs>
</telerik:RadTabStrip>
<telerik:RadMultiPage Width="900" ID="radMultiPage" runat="server" SelectedIndex="0">
           <telerik:RadPageView ID="rpvTradeName" runat="server">
                <MyUserControl:TradeName ID="ucTradeName" runat="server" />
            </telerik:RadPageView>
           <telerik:RadPageView  ID="rpvViewAll" runat="server">
                <MyUserControl:ViewAll ID="ucViewAll" runat="server" />
            </telerik:RadPageView>
        </telerik:RadMultiPage>

TradeName.ascx

  

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

    <AjaxSettings>

        <telerik:AjaxSetting AjaxControlID="rgTradeName">

            <UpdatedControls>

                <telerik:AjaxUpdatedControl ControlID="rgTradeName" />

                <telerik:AjaxUpdatedControl ControlID="rgvaTradeName" />

            </UpdatedControls>

        </telerik:AjaxSetting>

    </AjaxSettings>

</telerik:RadAjaxManagerProxy>

 

<telerik:RadGrid runat="server" AllowSorting="true"

    ID="rgTradeName" AutoGenerateColumns="false"

        OnNeedDataSource="SheetNeedDataSource"

        OnItemCommand="SheetItemCommand"

        OnDeleteCommand="SheetDeleteCommand" AllowPaging="true" PageSize="10"

    />

  

  

ViewAll.ascx

  

<telerik:RadGrid ID="rgvaTradeName" runat="server" />

Can you tell me why my rgvaTradeName are not updated when the rgTradeName are updated ? Maybe i'm not doing it correctly ?

Thanks in advance

[Al]

Anyone can help me out with this scenario ?

[Maria Ilieva]

Hello Al,

Note that there are some specifics in ajaxifying RadTabStrip and RadMultiPage controls.Single PageView (or control in pageview) could not be added as AJAX initiator or updated control in the AJAX settings. The only possible approach is to add the whole MultiPage in the RadAjaxManager settings or wrap the whole control into RadAjaxPanel. When you set the MultiPage as an updated control, you should also include the TabStrip associated with it in the Ajax settings. For example:

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="rtsSheet">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="rtsSheet" />
                    <telerik:AjaxUpdatedControl ControlID="radMultiPage" />
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="radMultiPage">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="rtsSheet" />
                    <telerik:AjaxUpdatedControl ControlID="radMultiPage" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>

I hope thi shelps.

All the best,
Maria Ilieva
the Telerik team

[Al]

Thanks Maria for the reply.

From what you wrote, if i understand correctly, the updated control will be the whole multipage, so the whole RadMultiPage will be updated ?

[Maria Ilieva]

Hello Al,

You are correct. This is the only valid approach for ajaxifying RadMultiPage and RadTabStrip controls.

All the best,
Maria Ilieva
the Telerik team

[Chetan]

So I understand that whole RadMultiPage will be updated but I want to make this scenario. Please help me out how should I implement this.?

I have a 2 tabs Tab1, Tab2, Tab3. Now I am using the lazy load demo example to load Usercontrols on each tab click UC1 , UC2, UC3.

Now what I want is on UC2 if they change something I want UC1 content updated only when Tab1 is clicked(when information is requested) So what I have done is added Ajax to asp panel inside UC1 and added ajax setting and I use client side event to trigger button click inside the panel. Now I do not want Tab 2 content to be reloaded but alas it does. I have to preserve its client state since I have some client side data pulled in in tab 2. 

How do I go about doing all this without resetting the client state of other pageviews? 

When I trigger postback inside UC1 loading panel does not show up.

Overall, is there different approach I can use? I really want lazy loading though cause content is huge list of names.

[Maria Ilieva]

Hi,

Possible approach in this case is adding programmatic Ajax settings in the RadMultiPage PageViewCreated event in which the panel holders of the UserControl update only the corresponding containers. See the help topic below that elaborates on adding programmatic settings:
http://docs.telerik.com/devtools/aspnet-ajax/controls/ajax/radajaxmanager/how-to/add-ajaxsettings-programmatically

Regards,
Maria Ilieva
Telerik