Any thoughts?
4 Answers, 1 is accepted
Can you show us some sample markup from your page? Specifically, the markup that shows how you've configured your RadAjaxLoadingPanel and your RadAjaxManager. This will help us analyze what's going on and provide you with some guidance. In general, the scenario you're describing should work without issue, so there is clearly a simple configuration problem at play here.
As soon as I see your code, I'll be happy to provide more advice.
-Todd
Thanks for the response, here is the markup.
The first control lblStatus is typically invisible and would hold a message if there was no data display. The 2nd control, Pager1 is the custom server control that shows the number of pages and allows you to navigate through them. Finally you will see the datagrid, dgCourses.
When you get to the AJAXManager you will see that two controls, Pager1 and a button are set to initiate the ajax refreshes. The button works completely fine, and the pager works fine, except the loading panel does not display.
Thanks for any insight.
Chris
<tr>
<td colspan=2>
<asp:label id="lblStatus" runat="server" CssClass="cssContent" Width="468px"></asp:label>
</td>
</tr>
<tr>
<td colspan=2>
<cc1:pager id="Pager1" runat="server" CssClass="content" Width="100%" Font-Names="Verdana" Font-Size="X-Small"
MaxPages="10" ShowAddNew="False" PageSize="10" ShowNextPrevPages="True">
<FirstIcon DisabledImageURL="~/Images/nav_first.gif" ImageAlign="AbsMiddle" IconDisplayStyle="Image"
Text="|&lt;" Width="" Height="" ImageURL="~/Images/nav_first.gif"></FirstIcon>
<NextIcon DisabledImageURL="" ImageAlign="AbsMiddle" IconDisplayStyle="Image" Text="&gt;"
Width="" Height="" ImageURL="~/Images/nav_next.gif"></NextIcon>
<PreviousPagesIcon DisabledImageURL="" ImageAlign="AbsMiddle" IconDisplayStyle="Image" Text="&lt;&lt;"
Width="" Height="" ImageURL="~/Images/nav_backpages.gif"></PreviousPagesIcon>
<AddNewIcon DisabledImageURL="" ImageAlign="AbsMiddle" IconDisplayStyle="Text" Text="&gt;*"
Width="" Height="" ImageURL=""></AddNewIcon>
<NextPagesIcon DisabledImageURL="" ImageAlign="AbsMiddle" IconDisplayStyle="Image" Text="&gt;&gt;"
Width="" Height="" ImageURL="~/Images/nav_nextpages.gif"></NextPagesIcon>
<LastIcon DisabledImageURL="~/Images/nav_last.gif" ImageAlign="AbsMiddle" IconDisplayStyle="Image"
Text="&gt;|" Width="" Height="" ImageURL="~/Images/nav_last.gif"></LastIcon>
<PreviousIcon DisabledImageURL="" ImageAlign="AbsMiddle" IconDisplayStyle="Image" Text="&lt;"
Width="" Height="" ImageURL="~/Images/nav_back.gif"></PreviousIcon>
</cc1:pager>
</td>
</tr>
<tr>
<td colspan=2>
<asp:datagrid id="dgCourses" runat="server"
CssClass="cssContent" Width="100%" Height="32px" AutoGenerateColumns="False" CellPadding="3"
BorderWidth="1px" BorderColor="Silver" ShowFooter="True" OnItemCommand="GridClicked" GridLines=none
BorderStyle="Solid">
<EditItemStyle CssClass="cssSelectedRow"></EditItemStyle>
<AlternatingItemStyle CssClass="cssEvenRow"></AlternatingItemStyle>
<ItemStyle CssClass="cssOddRow"></ItemStyle>
<HeaderStyle CssClass="cssHeaderRow"></HeaderStyle>
<FooterStyle CssClass="cssFooterRow"></FooterStyle>
<Columns>
<asp:BoundColumn Visible="False" DataField="CourseID" ReadOnly="True"></asp:BoundColumn>
<asp:TemplateColumn HeaderText="Grade Level">
<ItemStyle Width="45px" VerticalAlign="Top"></ItemStyle>
<ItemTemplate>
<%
# Container.DataItem("StartGrade")%>
-
<%
# Container.DataItem("EndGrade")%>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="Department">
<ItemStyle Width="160px" VerticalAlign="Top"></ItemStyle>
<ItemTemplate>
<%
# Container.DataItem("Department")%>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="Course">
<ItemStyle VerticalAlign="Top"></ItemStyle>
<ItemTemplate>
<asp:LinkButton CommandName="edit" Runat="server" ID="Linkbutton1">
<%
# Container.DataItem("CourseName")%>
</asp:LinkButton>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="Delete" HeaderStyle-HorizontalAlign=Center>
<ItemStyle Width="40px" VerticalAlign="Top" HorizontalAlign=Center></ItemStyle>
<ItemTemplate>
<asp:ImageButton ImageUrl="../Images/delete.gif" AlternateText="Delete" CommandName="Delete" Runat="server"
ID="imgDelete"></asp:ImageButton>
</ItemTemplate>
</asp:TemplateColumn>
</Columns>
</asp:datagrid>
</td>
</tr>
</table>
<uc1:bottom id="Bottom1" runat="server"></uc1:bottom>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel1">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="btnSearch">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="lblStatus" />
<telerik:AjaxUpdatedControl ControlID="Pager1" />
<telerik:AjaxUpdatedControl ControlID="dgCourses" />
</UpdatedControls>
</telerik:AjaxSetting>
<telerik:AjaxSetting AjaxControlID="Pager1">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="lblStatus" />
<telerik:AjaxUpdatedControl ControlID="Pager1" />
<telerik:AjaxUpdatedControl ControlID="dgCourses" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Height="75px"
Width="75px">
<img alt="Loading..." src='<%= RadAjaxLoadingPanel.GetWebResourceUrl(Page, "Telerik.Web.UI.Skins.Default.Ajax.loading3.gif") %>'
style="border-right: 0px; border-top: 0px; border-left: 0px; border-bottom: 0px" />
</telerik:RadAjaxLoadingPanel>
Thanks for the response, here is the markup.
The first control lblStatus is typically invisible and would hold a message if there was no data display. The 2nd control, Pager1 is the custom server control that shows the number of pages and allows you to navigate through them. Finally you will see the datagrid, dgCourses.
When you get to the AJAXManager you will see that two controls, Pager1 and a button are set to initiate the ajax refreshes. The button works completely fine, and the pager works fine, except the loading panel does not display.
Thanks for any insight.
Chris
<tr>
<td colspan=2>
<asp:label id="lblStatus" runat="server" CssClass="cssContent" Width="468px"></asp:label>
</td>
</tr>
<tr>
<td colspan=2>
<cc1:pager id="Pager1" runat="server" CssClass="content" Width="100%" Font-Names="Verdana" Font-Size="X-Small"
MaxPages="10" ShowAddNew="False" PageSize="10" ShowNextPrevPages="True">
<FirstIcon DisabledImageURL="~/Images/nav_first.gif" ImageAlign="AbsMiddle" IconDisplayStyle="Image"
Text="|&lt;" Width="" Height="" ImageURL="~/Images/nav_first.gif"></FirstIcon>
<NextIcon DisabledImageURL="" ImageAlign="AbsMiddle" IconDisplayStyle="Image" Text="&gt;"
Width="" Height="" ImageURL="~/Images/nav_next.gif"></NextIcon>
<PreviousPagesIcon DisabledImageURL="" ImageAlign="AbsMiddle" IconDisplayStyle="Image" Text="&lt;&lt;"
Width="" Height="" ImageURL="~/Images/nav_backpages.gif"></PreviousPagesIcon>
<AddNewIcon DisabledImageURL="" ImageAlign="AbsMiddle" IconDisplayStyle="Text" Text="&gt;*"
Width="" Height="" ImageURL=""></AddNewIcon>
<NextPagesIcon DisabledImageURL="" ImageAlign="AbsMiddle" IconDisplayStyle="Image" Text="&gt;&gt;"
Width="" Height="" ImageURL="~/Images/nav_nextpages.gif"></NextPagesIcon>
<LastIcon DisabledImageURL="~/Images/nav_last.gif" ImageAlign="AbsMiddle" IconDisplayStyle="Image"
Text="&gt;|" Width="" Height="" ImageURL="~/Images/nav_last.gif"></LastIcon>
<PreviousIcon DisabledImageURL="" ImageAlign="AbsMiddle" IconDisplayStyle="Image" Text="&lt;"
Width="" Height="" ImageURL="~/Images/nav_back.gif"></PreviousIcon>
</cc1:pager>
</td>
</tr>
<tr>
<td colspan=2>
<asp:datagrid id="dgCourses" runat="server"
CssClass="cssContent" Width="100%" Height="32px" AutoGenerateColumns="False" CellPadding="3"
BorderWidth="1px" BorderColor="Silver" ShowFooter="True" OnItemCommand="GridClicked" GridLines=none
BorderStyle="Solid">
<EditItemStyle CssClass="cssSelectedRow"></EditItemStyle>
<AlternatingItemStyle CssClass="cssEvenRow"></AlternatingItemStyle>
<ItemStyle CssClass="cssOddRow"></ItemStyle>
<HeaderStyle CssClass="cssHeaderRow"></HeaderStyle>
<FooterStyle CssClass="cssFooterRow"></FooterStyle>
<Columns>
<asp:BoundColumn Visible="False" DataField="CourseID" ReadOnly="True"></asp:BoundColumn>
<asp:TemplateColumn HeaderText="Grade Level">
<ItemStyle Width="45px" VerticalAlign="Top"></ItemStyle>
<ItemTemplate>
<%
# Container.DataItem("StartGrade")%>
-
<%
# Container.DataItem("EndGrade")%>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="Department">
<ItemStyle Width="160px" VerticalAlign="Top"></ItemStyle>
<ItemTemplate>
<%
# Container.DataItem("Department")%>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="Course">
<ItemStyle VerticalAlign="Top"></ItemStyle>
<ItemTemplate>
<asp:LinkButton CommandName="edit" Runat="server" ID="Linkbutton1">
<%
# Container.DataItem("CourseName")%>
</asp:LinkButton>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="Delete" HeaderStyle-HorizontalAlign=Center>
<ItemStyle Width="40px" VerticalAlign="Top" HorizontalAlign=Center></ItemStyle>
<ItemTemplate>
<asp:ImageButton ImageUrl="../Images/delete.gif" AlternateText="Delete" CommandName="Delete" Runat="server"
ID="imgDelete"></asp:ImageButton>
</ItemTemplate>
</asp:TemplateColumn>
</Columns>
</asp:datagrid>
</td>
</tr>
</table>
<uc1:bottom id="Bottom1" runat="server"></uc1:bottom>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel1">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="btnSearch">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="lblStatus" />
<telerik:AjaxUpdatedControl ControlID="Pager1" />
<telerik:AjaxUpdatedControl ControlID="dgCourses" />
</UpdatedControls>
</telerik:AjaxSetting>
<telerik:AjaxSetting AjaxControlID="Pager1">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="lblStatus" />
<telerik:AjaxUpdatedControl ControlID="Pager1" />
<telerik:AjaxUpdatedControl ControlID="dgCourses" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Height="75px"
Width="75px">
<img alt="Loading..." src='<%= RadAjaxLoadingPanel.GetWebResourceUrl(Page, "Telerik.Web.UI.Skins.Default.Ajax.loading3.gif") %>'
style="border-right: 0px; border-top: 0px; border-left: 0px; border-bottom: 0px" />
</telerik:RadAjaxLoadingPanel>
Chris