Missing Ajax functionality when adding Grid dynamically

[Simon]

Hi,

i am new to telerik. I have built a user control with the following code:

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControl.ascx.cs" Inherits="WebUserControl" Codebehind="WebUserControl.ascx.cs" ClassName="WebUserControl" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>
<asp:SqlDataSource ID="GridSource" runat="server" ConnectionString="<%$ ConnectionStrings:Test%>" SelectCommand="SELECT * FROM Evt"> </asp:SqlDataSource>

<telerik:RadGrid ID="RadGrid1" runat="server" CellSpacing="0"
        DataSourceID="GridSource" AllowFilteringByColumn="True" AllowPaging="True"
        AllowSorting="True" ShowGroupPanel="True">
        <ClientSettings AllowDragToGroup="True">
            <Scrolling AllowScroll="True" UseStaticHeaders="True" />
        </ClientSettings>
    <MasterTableView>
        <CommandItemSettings ExportToPdfText="Export to PDF"></CommandItemSettings>

        <RowIndicatorColumn FilterControlAltText="Filter RowIndicator column">
            <HeaderStyle Width="20px"></HeaderStyle>
        </RowIndicatorColumn>

        <ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column">
            <HeaderStyle Width="20px"></HeaderStyle>
        </ExpandCollapseColumn>

        <EditFormSettings>
            <EditColumn FilterControlAltText="Filter EditCommandColumn column"></EditColumn>
        </EditFormSettings>
    </MasterTableView>

    <FilterMenu EnableImageSprites="False"></FilterMenu>

    <HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Default"></HeaderContextMenu>
</telerik:RadGrid>

 <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="RadGrid1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="RadGrid1"
                    LoadingPanelID="RadAjaxLoadingPanel1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
 </telerik:RadAjaxManager>

When i put it in a content tag in my html code it works fine. But i would like to add the control via a click on a button.
So on the page where the button is located i wrote the following in the code behind:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class SiteMaster : System.Web.UI.MasterPage
{
    WebUserControl ctrl;

    protected void Page_Load(object sender, EventArgs e)
    {
            Button BTN1 = new Button();
            BTN1.Click += new EventHandler(BTN_Click);

            this.MenuContent.Controls.Add(BTN1);
    }
    protected void BTN_Click(object sender, EventArgs e)
    {
        ctrl = (WebUserControl)LoadControl("~/WebUserControl.ascx");
        this.MenuContent.Controls.Add(ctrl);
    }
}

Has anybody an idea why this doesn't work or a solution so ajax functionality will be enabled for this purpose?

Thanks
Simon

[Pavlina]

Hi Simon,

The dynamic loading of user controls follows the same logic as in normal postback application. You can load custom user controls via AJAX requests by following the steps provided in the help topic below:
http://www.telerik.com/help/aspnet-ajax/ajax-load-user-controls.html

Give it a try and let me know how it goes.

Regards,
Pavlina
the Telerik team

[Simon]

Hi Pavlina,

i tried the code example and i can add my control. This works. Thanks for this.
I use a datatable with over 12.000 entries. I found out that paging and pagesize works good but sorting does not work very well. When i click the sorting buttons on the grid colums the grid does not sort. Have you got an idea to fix this?

Regards,

Simon

[Simon]

Hi,

i have to correct myself. Sorting does not work properly and pagesizing does not work properly too. When pagesize is not set i select e.g pagesize 50 on the grid. When i select another page, the pagesize will be set back to 10.

Regards

Simon

[Pavlina]

Hello Simon,

Can you please verify that you have no DataBind() calls somewhere in your code? If the issue seems to be elsewhere, please send us a sample working project where the erroneous behavior can be observed and we will do our best to advice you further.

Greetings,
Pavlina
the Telerik team

[Simon]

Hi Pavlina,

there is no DataBind() in the code.
Further I saw in the documentation http://www.telerik.com/help/aspnet-ajax/ajax-load-user-controls.html that the control is put into an asp:panel. I read to use instead of that an asp:Placeholder. With that modification i have no more problems about the behavior i wrote in the posts before. Can you please check this if I am right?

Regards,

Simon

[Pavlina]

Hello Simon,

Indeed when you load user controls with ajax you need to have an appropriate container for it. Also you should instantiate your user control in Page_Init or Page_Load and always recreate the last loaded User Control. 

If other questions or problems arise, please do not hesitate to contact us.

Kind regards,
Pavlina
the Telerik team