Loadcontrol Usercontrol javascript error

[Jomey]

This load the usercontrol - that has a grid with AllowFilteringByColumn="True".  When u filter once it works, but any other time or if u click on the edit button inside the grid.  You get javascript errors.  Only javascript actions cause the error.  Any server side action doesn't cause error.

If I don't load the page dynamically and just drag the usercontrol over, there are no problems.

protected void Page_Load(object sender, EventArgs e)

{

UserControl ucControl;

// Insert some whitespace

this.Controls.Add(new LiteralControl("<br />"));

string fileName = Request.QueryString["f"].ToString();

 

ucControl = (

UserControl)LoadControl("~/Admin/Forms/" + fileName + ".ascx");

ucControl.ID = fileName;

pnlControl.Controls.Add(ucControl);

}

[Jomey]

Any javascript inside the grid doesn't work after u filter when loading the usercontrol that contains the grid dynamically.

[Vlad]

Hi Jomey,

How the grid is bound in your case?

Sincerely yours,
Vlad
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Jomey]

Declaratively

<

telerik:RadGrid ID="RadGrid1" runat="server" AllowPaging="True" AllowSorting="True" DataSourceID="SqlDataSource1" GridLines="None" Skin="Hay" Width="100%" OnItemCreated="RadGrid1_ItemCreated" OnInsertCommand="RadGrid1_InsertCommand" OnItemCommand="RadGrid1_ItemCommand" OnDataBound="RadGrid1_DataBound" OnItemDataBound="RadGrid1_ItemDataBound" AllowAutomaticInserts="false">

 

[Jomey]

The radajaxmanager causes the error.  Is it a bug?

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



My full code - user control:
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="RadGrid1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>

<asp:SqlDataSource ID="SqlDataSource1" runat="server"
    ConnectionString="<%$ ConnectionStrings:ACT %>"
    SelectCommand="SELECT * FROM booter"></asp:SqlDataSource>
<telerik:RadGrid ID="RadGrid1" runat="server" AllowPaging="True" AllowSorting="True"
    DataSourceID="SqlDataSource1" GridLines="None" Skin="Hay" Width="100%" OnItemCreated="RadGrid1_ItemCreated"
    OnInsertCommand="RadGrid1_InsertCommand" OnItemCommand="RadGrid1_ItemCommand"
    OnDataBound="RadGrid1_DataBound" OnItemDataBound="RadGrid1_ItemDataBound" AllowAutomaticInserts="false">
    <EditItemStyle ForeColor="Gray"></EditItemStyle>
    <MasterTableView AutoGenerateColumns="False" DataSourceID="SqlDataSource1" Width="945px"
        TableLayout="Fixed" PageSize="20" DataKeyNames="Loan_Number" CommandItemDisplay="TopAndBottom"
        EditMode="PopUp" AllowFilteringByColumn="True">
        <RowIndicatorColumn Visible="False">
            <HeaderStyle Width="20px"></HeaderStyle>
        </RowIndicatorColumn>
        <ExpandCollapseColumn Visible="False" Resizable="False">
            <HeaderStyle Width="20px"></HeaderStyle>
        </ExpandCollapseColumn>
       
        <Columns>
            <telerik:GridTemplateColumn DataField="test" HeaderText="test" SortExpression="test"
                UniqueName="test">
                <ItemTemplate>
                    <asp:Label ID="testLabel" runat="server" Text='<%# Eval("test") %>'></asp:Label>
                </ItemTemplate>
            </telerik:GridTemplateColumn>
        </Columns>
        <PagerStyle Mode="NextPrevNumericAndAdvanced" />
    </MasterTableView>
    <ClientSettings AllowColumnsReorder="True" ReorderColumnsOnClient="True">
        <Selecting AllowRowSelect="True"></Selecting>
        <Scrolling AllowScroll="True" UseStaticHeaders="True" ScrollHeight="500px" />
    </ClientSettings>
</telerik:RadGrid>
<telerik:RadWindowManager ID="RadWindowManager1" runat="server" Skin="Hay">
    <Windows>
        <telerik:RadWindow Skin="Hay" ID="UserListDialog" runat="server" Title="User List Dialog"
            Height="380px" Width="400px" Left="150px" ReloadOnShow="false" Modal="true" VisibleStatusbar="false"
            VisibleOnPageLoad="false" ShowContentDuringLoad="false" />
    </Windows>
</telerik:RadWindowManager>


The page loading the usercontrol:
    <form id="form1" runat="server">
            <ajaxToolKit:ToolkitScriptManager ID="smMain" EnablePageMethods="true"
            EnablePartialRendering="true" ScriptMode="Release" EnableViewState="false"
            AllowCustomErrorsRedirect="true" LoadScriptsBeforeUI="true" CombineScripts="true" runat="server"
            >
            <Scripts>
                <asp:ScriptReference Path="~/Includes/JScript.js" ScriptMode="Auto" />
                <asp:ScriptReference Path="~/Includes/Async.js" ScriptMode="Auto" />
            </Scripts>
            </ajaxToolKit:ToolkitScriptManager>
    <div>
        <asp:Panel ID="pnlControl" runat="server">
    </asp:Panel>
    </div>
    </form>

Codebehind:

UserControl ucControl;

// Insert some whitespace

this.Controls.Add(new LiteralControl("<br />"));

string fileName = "teststst";

ucControl = (

UserControl)LoadControl("~/Admin/gridexdel.ascx");

ucControl.ID = fileName;

pnlControl.Controls.Add(ucControl);

[Jomey]

I even tried to bind this way and still get the error:

protected void RadGrid1_NeedDataSource(object source, GridNeedDataSourceEventArgs e)

{

RadGrid1.DataSource =

new actBLL().GetUserRolesGrid();

}

[Sebastian]

Hello Jomey,

Can you please verify that you are loading the user control (holding the grid instance) dynamically in par with the conventions outlined in these online resources:

http://www.telerik.com/DEMOS/ASPNET/Prometheus/Ajax/Examples/Common/LoadingUserControls/DefaultCS.aspx
http://www.telerik.com/help/aspnet-ajax/ajxloadusercontrols.html

This should ensure that the viewstate of the controls will remain consistent and they event lifecycle will be kept intact.

Additionally, if you have some external javascript inside the programmatically loaded user control, check whether loading these scripts with the AjaxControlToolkit.ToolkitScriptManager.RegisterStartupScript method alleviates the abnormality. Also test whether setting the EnableViewState property of the ToolkitScrtiptManager to true makes a difference.

Best regards,
Stephen
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Jomey]

Fixed the problem by putting the loadcontrol in the page_init instead of the page_load