replace UpdatePanel with telerik

Question

I've some drop down controls in my aspx page. The values of these dropdown come from database. With every dropdown we have used asp:UpdatePanel. I want to replace the code with telerik. I am not sure which control should be used in place of UpdatePanel. 1. Should I use RadAjaxManager or RadAjaxPanel or anything else? 2. Also what about ContentTemplate how to replace with teleirk

<td class="tbl_input">
    <asp:UpdatePanel ID="UpdatePanel" runat="server">
        <ContentTemplate>                                                  
            <asp:ListBox ID="paymentSystem" runat="server" Rows="1"></asp:ListBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="paymentSystem"
                Display="Dynamic" ErrorMessage="* Please select the Payment system" SetFocusOnError="True" />
        </ContentTemplate>
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="paymentSystem" EventName="SelectedIndexChanged" />
        </Triggers>
    </asp:UpdatePanel>
</td>

<td>
    <asp:UpdatePanel ID="UpdatePane2" runat="server">
        <ContentTemplate>
            <asp:ListBox ID="currency" runat="server" Rows="1">
                <asp:ListItem Value="">--- SELECT ---</asp:ListItem>
            </asp:ListBox>                            
            <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="currency"
                Display="Dynamic" ErrorMessage="* Please select the currency code for cash payment" SetFocusOnError="True" />
        </ContentTemplate>
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="currency" EventName="SelectedIndexChanged" />
        </Triggers>
    </asp:UpdatePanel>
</td>

How to migrate this controls using telerik?

Answer 1

There are different ways to do that, and perhaps RadAjaxManager will give you the most flexibility. Below you can find an example. As for the ContentTemplate tag - there is no need for that with the RadAjaxManager/RadAjaxPanel control.

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="paymentSystem">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="paymentSystem" />
            </UpdatedControls>
        </telerik:AjaxSetting>
        <telerik:AjaxSetting AjaxControlID="currency">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="currency" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>
<td class="tbl_input">
    <asp:ListBox ID="paymentSystem" runat="server" Rows="1"></asp:ListBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="paymentSystem"
                                Display="Dynamic" ErrorMessage="* Please select the Payment system" SetFocusOnError="True" />
</td>

<td>
    <asp:ListBox ID="currency" runat="server" Rows="1">
        <asp:ListItem Value="">--- SELECT ---</asp:ListItem>
    </asp:ListBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="currency"
                                Display="Dynamic" ErrorMessage="* Please select the currency code for cash payment" SetFocusOnError="True" />
</td>

If this is in a user control/content page, you can use RadAjaxManagerProxy instead, because RadAjaxManager is a singleton.