RadAjaxLoadingPanel not displaying on RadGrid Filter

4 posts, 0 answers
  1. Eric
    Eric avatar
    5 posts
    Member since:
    Mar 2011

    Posted 14 Apr 2011 Link to this post

    I modified the RADGrid Basic Filtering demo very slightly to try it out inside a content page. Very little changed other than that I simplified the grid to one column and changed data to be set using the OnNeedsDatasource event.... The grid loads and filters the data but I never see the RADAJAXLoadingPanel. The first time I run it I sometimes see the panel for a tenth of a second but it goes away while the code is still processing ( I put a threading.thread.sleep on the Page load event to be sure). Any clue what I'm doing wrong. I would like it to work like the demo. Listed below is my code:
    <%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master" CodeBehind="WebForm2.aspx.vb" Inherits="_3POC.WebForm2" %>
    <%@ Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik" %>
    <asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
    </asp:Content>
    <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
        <!-- content start -->
        <asp:ScriptManagerProxy ID="ScriptManagerProxy1" runat="server">
        </asp:ScriptManagerProxy>
            <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
                <AjaxSettings>
                    <telerik:AjaxSetting AjaxControlID="RadGrid1">
                        <UpdatedControls>
                            <telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="RadAjaxLoadingPanel1" />
                        </UpdatedControls>
                    </telerik:AjaxSetting>
                </AjaxSettings>
            </telerik:RadAjaxManager>
            <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Vista" ></telerik:RadAjaxLoadingPanel>
          
            <telerik:RadCodeBlock runat="server" ID="radCodeBlock">
                <script type="text/javascript">
                    function showFilterItem() {
                        $find('<%=RadGrid1.ClientID %>').get_masterTableView().showFilterItem();
                    }
                    function hideFilterItem() {
                        $find('<%=RadGrid1.ClientID %>').get_masterTableView().hideFilterItem();
                    
                </script>
            </telerik:RadCodeBlock>
                      
            <div>
                Show filtering item <input id="Radio1" type="radio" runat="server" name="showHideGroup" checked="true" onclick="showFilterItem()" /><label for="Radio1">Yes</label
                <input id="Radio2" type="radio" runat="server" name="showHideGroup" onclick="hideFilterItem()"/><label for="Radio2" >No</label>
            </div>
            <br/>
            <telerik:RadGrid AutoGenerateColumns="false" ID="RadGrid1" OnNeedDataSource="RadGrid1_NeedDataSource"
                Width="760px" AllowFilteringByColumn="True" AllowSorting="True"
                PageSize="15" ShowFooter="True" AllowPaging="True" runat="server"
                GridLines="None" EnableLinqExpressions="false" >
                <PagerStyle Mode="NextPrevAndNumeric" />
                <GroupingSettings CaseSensitive="false" />
                <MasterTableView AutoGenerateColumns="false" EditMode="InPlace" AllowFilteringByColumn="True"
                    ShowFooter="True" TableLayout="Auto">
                    <Columns>
                       
                                                    <telerik:GridBoundColumn ItemStyle-Width="100%" DataField="FieldName" ShowFilterIcon="false" AllowFiltering="true" CurrentFilterFunction="StartsWith" 
                                                        UniqueName="column" AutoPostBackOnFilter="true" FilterDelay="2000">
                                                    </telerik:GridBoundColumn>
                                                </Columns>
                                                  
                </MasterTableView>
                <ClientSettings>
                    <Scrolling AllowScroll="false" />
                </ClientSettings>
            </telerik:RadGrid>
            <br />
            <asp:Button Text="PostBack" runat="server" ID="Button1" CssClass="button" style="margin:0 20px 0;" />
                Click "PostBack" to see the state of the grid is preserved.
             
              
              
    </asp:Content>
  2. Pavlina
    Admin
    Pavlina avatar
    6187 posts

    Posted 19 Apr 2011 Link to this post

    Hi Eric,

    I followed your scenario and prepared a sample project that is working as expected. Please give it a try and let me know if it works for you or you need further assistance.

    Regards,
    Pavlina
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  3. Chandan Dey
    Chandan Dey avatar
    50 posts
    Member since:
    Aug 2012

    Posted 18 Nov 2011 Link to this post

    Hi,

    I tried your suggestion and it made no difference.

    In my tekerik rad grid the telerik RadAjaxLoadingPanel not showing.
    My requrement I have a Button & a Rad Grid when user click on button the RadAjaxLoadingPanel loading circle want to show and when user click rad grid header column RadAjaxLoadingPanel loading circle also show. But in my application its not happening.
    Please advice. I am using trial version of "Telerik.Web.UI_2011_1_413_Dev".
    One more thing if I use "telerik:RadAjaxPanel" there is a JavaScript error (Microsoft JScript runtime error: Unable to set value of the property 'control': object is null or undefined).

    I am sending you my test code.
    I am using master page.

    <%@ Page Language="C#" MasterPageFile="~/Site1.Master" AutoEventWireup="true" CodeBehind="TestPage.aspx.cs" Inherits="Test.TestPage" %>
    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>


    <asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <%--<script language="javascript" type="text/javascript">
        var currentLoadingPanel = null;
        var currentUpdatedControl = null;
        function RequestStart(sender, args) {
            currentLoadingPanel = $find("<%= RadAjaxLoadingPanel1.ClientID%>");


            if (args.get_eventTarget() == "<%= rgOrderDetails.UniqueID %>") {


                currentUpdatedControl = "<%= rgOrderDetails.ClientID %>";
                //show the loading panel over the updated control 
                currentLoadingPanel.show(currentUpdatedControl);
            }
        }
        function ResponseEnd() {
            //hide the loading panel and clean up the global variables 
            if (currentLoadingPanel != null) {
                currentLoadingPanel.hide(currentUpdatedControl);
            }
            currentUpdatedControl = null;
            currentLoadingPanel = null;
        } 
    </script>--%>
    </asp:Content>
    <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
        <div id="divCurrentOpenWorkOrders">
            <%--<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" >--%>
                <br /><br />
                <span class="PageTitle">Current Open Work Orders</span>
                <br /><br />
                <table width="78%">
                    <tr>
                        <td align="left">
                            <telerik:RadButton ID="btnAddNew" runat="server" Text="Add New" OnClick="btnAddNew_Click"></telerik:RadButton>
                        </td>
                        <td align="right">
                            <asp:Label ID="lblFilter" runat="server" Text="Filter by Status :"></asp:Label>
                        </td>
                        <td align="left">
                            <telerik:RadComboBox ID="cmbStatus" runat="server" onselectedindexchanged="cmbStatus_SelectedIndexChanged" AutoPostBack="true">
                                <Items>
                                    <telerik:RadComboBoxItem Value="0" Text="All" />
                                    <telerik:RadComboBoxItem Value="1" Text="Open" />
                                    <telerik:RadComboBoxItem Value="2" Text="Complete" />
                                </Items>
                            </telerik:RadComboBox>
                            
                        </td>
                    </tr>
                    <tr>
                        <td style="height:5px;"></td>
                    </tr>
                </table>
                <div id="divOrderDetails">
                    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
                        <AjaxSettings>
                            <telerik:AjaxSetting AjaxControlID="rgOrderDetails">
                                <UpdatedControls>
                                    <telerik:AjaxUpdatedControl ControlID="rgOrderDetails" LoadingPanelID="RadAjaxLoadingPanel1" />
                                </UpdatedControls>
                            </telerik:AjaxSetting>
                            <telerik:AjaxSetting AjaxControlID="btnAddNew">
                                <UpdatedControls>
                                    <telerik:AjaxUpdatedControl ControlID="RadAjaxLoadingPanel1" />
                                </UpdatedControls>
                            </telerik:AjaxSetting>
                        </AjaxSettings>
                    </telerik:RadAjaxManager>


                    <telerik:RadGrid ID="rgOrderDetails" runat="server" AllowSorting="true" AllowPaging="true" PageSize="10" AutoGenerateColumns="false" Skin="WebBlue" OnItemCommand="rgOrderDetails_ItemCommand" OnItemDataBound="rgOrderDetails_ItemDataBound" oninit="rgOrderDetails_Init1" onitemcreated="rgOrderDetails_ItemCreated">
                        <HeaderStyle CssClass="dg_font" />
                        <ItemStyle CssClass="dg_font" />
                        <AlternatingItemStyle CssClass="dg_font" />
                        <MasterTableView DataKeyNames="WorkOrderNo" AutoGenerateColumns="false" >
                            <Columns>
                                <telerik:GridHyperLinkColumn DataNavigateUrlFields="WorkOrderNo, CustomerName, BuildingName" UniqueName="WorkOrderNo" HeaderText="Work Order No." DataTextField="WorkOrderNo" DataTextFormatString="<u>{0}</u>" SortExpression="WorkOrderNo" DataNavigateUrlFormatString="WorkOrderEquipment.aspx?wo={0}&amp;cn={1}&amp;bn={2}&amp;" >
                                </telerik:GridHyperLinkColumn>
                                <telerik:GridTemplateColumn HeaderText="Date" SortExpression="OrderDate" >
                                    <ItemTemplate>
        <%# (System.Convert.ToDateTime(DataBinder.Eval(Container.DataItem, "OrderDate"))).ToString("MMM dd, yyyy")%>
        </ItemTemplate>
                                </telerik:GridTemplateColumn>
                                <telerik:GridBoundColumn DataField="Customer" HeaderText="Customer" UniqueName="Customer" ></telerik:GridBoundColumn>
                                <telerik:GridBoundColumn DataField="Type" HeaderText="Type" UniqueName="Type" ></telerik:GridBoundColumn>
                                <telerik:GridBoundColumn DataField="StatusText" HeaderText="StatusText" UniqueName="StatusText" Visible="false"></telerik:GridBoundColumn>
                                <telerik:GridBoundColumn DataField="Status" HeaderText="Status" UniqueName="Status" ></telerik:GridBoundColumn>
                                <telerik:GridBoundColumn DataField="Building" HeaderText="Building" UniqueName="Building" ></telerik:GridBoundColumn>
                                <telerik:GridTemplateColumn HeaderText="" Visible="false">
                                    <ItemTemplate>
        <asp:LinkButton id="lnkView" runat="server" Text="View" CausesValidation="false" CommandName="Select" >View</asp:LinkButton>
        </ItemTemplate>
                                </telerik:GridTemplateColumn>
                                <telerik:GridBoundColumn DataField="CustomerName" HeaderText="CustomerName" UniqueName="CustomerName" Visible="false" ></telerik:GridBoundColumn>
                                <telerik:GridBoundColumn DataField="BuildingName" HeaderText="BuildingName" UniqueName="BuildingName" Visible="false" ></telerik:GridBoundColumn>
                            </Columns>
                        </MasterTableView>
                    </telerik:RadGrid>
                    <%--<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="" IsSticky="true" MinDisplayTime="1000" Width="256px" Height="64px" EnableSkinTransparency="false">--%>
                        <%--<div class="loading">
                            <asp:Image ID="Image1" runat="server" ImageUrl="~/Images/loading5.gif" AlternateText="loading" />
                        </div>--%>
                    <%--</telerik:RadAjaxLoadingPanel>--%>
                    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" Skin="Default" InitialDelayTime="0" MinDisplayTime="1000" EnableSkinTransparency="false" runat="server"></telerik:RadAjaxLoadingPanel>
                </div>
                <div class="div_footer"></div>
            <%--</telerik:RadAjaxPanel>--%>
        </div>
    </asp:Content>


    Thanks,
    Chandan
  4. Pavlina
    Admin
    Pavlina avatar
    6187 posts

    Posted 21 Nov 2011 Link to this post

    Hi Chandan Dey,

    I already answered your other ticket with the same questions. To avoid duplicate posts I suggest that we continue our communication there.

    Kind regards,
    Pavlina
    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
Back to Top