radajaxmanager control on multiple usercontrol

Thread is closed for posting
2 posts, 0 answers
  1. Satyajit
    Satyajit avatar
    8 posts
    Member since:
    Apr 2011

    Posted 01 Mar 2012 Link to this post

    Hi,

    Below I have given code of user control which I used multiple times on single page.But my problem is that I got null values in HandleScrolling() function when I moved grid scroll down to bottom.
    I have placed Radscriptmanager on main .aspx page.
    And one more important thing is I have made this user control's DLL and used in other project by adding reference of that usercontrol's dll.




    <%@ Control Language="C#" ClassName="Acme.MyTestUC" %>
    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
    <%@ Import Namespace="System.Web.UI.WebControls" %>
    <%@ Import Namespace="System.Data.SqlClient" %>
    <%@ Import Namespace="System.Data" %>
    <%@ Import Namespace=" System.Reflection" %>

    <script runat="server">
       
        protected void Page_Load(object sender, EventArgs e)
        {
            manager1 = RadAjaxManager.GetCurrent(this.Page);
            manager1.AjaxSettings.AddAjaxSetting(manager1, RadGrid2);
            manager1.AjaxRequest += new RadAjaxControl.AjaxRequestDelegate(manager1_AjaxRequest);
            
     

        }

        void manager1_AjaxRequest(object sender, AjaxRequestEventArgs e)
        {
            RadGrid2.PageSize += 15;
            RadGrid2.Rebind();
        }
        RadAjaxManager manager1;
       
       
    </script>

    <!-- content start -->
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">
                <!--
            function HandleScrolling(e) {
              
                var grid = $find("<%=RadGrid2.ClientID %>");

                //alert(grid.hasOwnProperty());

                            var scrollArea = document.getElementById("<%= RadGrid2.ClientID %>" + "_GridData");

                if (IsScrolledToBottom(scrollArea)) {
                    var currentlyDisplayedRecords = grid.get_masterTableView().get_pageSize() * (grid.get_masterTableView().get_currentPageIndex() + 1);

                    //if the presently visible items are less than the entire source records count
                    //trigger an ajax request to increase them
                    if (currentlyDisplayedRecords < 100) {
                        $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("LoadMoreRecords");
                    }
                }
            }
            //this method calculates whether you have reached the bottom when dragging the vertical grid scroll
            function IsScrolledToBottom(scrollArea) {
                var currentPosition = scrollArea.scrollTop + scrollArea.clientHeight;
                return currentPosition == scrollArea.scrollHeight;
            }
                -->
        </script>
    </telerik:RadCodeBlock>

     

    <telerik:RadAjaxManagerProxy  id="RadAjaxManager1" runat="server"> 
            <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadAjaxManager1"> 
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadGrid2" LoadingPanelID="RadAjaxLoadingPanel2"></telerik:AjaxUpdatedControl>
                </UpdatedControls>
            </telerik:AjaxSetting>
            </AjaxSettings>
    </telerik:RadAjaxManagerProxy >

    <telerik:RadGrid ID="RadGrid2" AllowSorting="True"
        runat="server" AllowPaging="true" Width="97%" PageSize="15" GridLines="Vertical">
        <PagerStyle Visible="false" />
        <MasterTableView TableLayout="Fixed" />
        <ClientSettings>
            <Scrolling AllowScroll="true" UseStaticHeaders="true" SaveScrollPosition="true" />
            <ClientEvents OnScroll="HandleScrolling" />
        </ClientSettings>
    </telerik:RadGrid>
    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel2" runat="server">
    </telerik:RadAjaxLoadingPanel>
    <br />


    Thanks in advance for any help.
    Regards,
    Satyajit Kadam.

  2. Andrey
    Admin
    Andrey avatar
    836 posts

    Posted 05 Mar 2012 Link to this post

    Hello,

    The only problem that I see in your code is that you set the ID property of the RadAjaxManagerProxy control to "RadAjaxManager1" and then you are trying to find the RadAjaxManager control with the same ID("RadAjaxManager1"). And since the RadAjaxManagerProxy control does not have AjaxRequest function that is why you are getting the null value in the JavaScript function. You could check this help topic for more information on how to initiate Ajax request through RadAjaxManager when you are using RadAjaxManagerProxy control.

    Basically, you need to change this if statement:

    if (currentlyDisplayedRecords < 100) {
       $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("LoadMoreRecords");
    }

    with this one:

    if (currentlyDisplayedRecords < 100) {
       $find("<%= RadAjaxManager.GetCurrent(Page).ClientID %>").ajaxRequest("LoadMoreRecords");  
    }

    Give this suggestion a try and check whether the issue is resolved.

    Regards,
    Andrey
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top