I have an updatepanel on my masterpage. Within the contentplace holder I have my update progress control. When a user clicks on the button I load some data into a gridview. This works perfectly in FireFox. User clicks the button, the loading image in my updateprogress fires and loads the gridview. When I test this in IE 6 or 7 or in Chrome. It does a full postback and the updateprogress is never shown. So the updatepanel doesnt seem to be working in these two browsers. Code is below. Again...it works perfect in FireFox.
***From Masterpage ***
<asp:UpdatePanel ID="UpdatePanel" runat="server">
<contenttemplate>
<asp:contentplaceholder id="holder" runat="server" />
</contenttemplate>
</asp:UpdatePanel>
**From aspx page ****
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
<img src="ajax-loader.gif" />
</ProgressTemplate>
</asp:UpdateProgress>
We had some namespace and dll issues with this.
Related
I have an async page load that fetches data from an API and binds it to a repeater inside an update panel, separate to local search results.
There is a script manager in the master page.
<div class="searchResultContainer" runat="server" id="divApiResults">
<div class="searchResult">
<asp:UpdatePanel ID="udpApiResults" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="true">
<ContentTemplate>
<asp:UpdateProgress ID="updateProgress" DisplayAfter="1000" runat="server">
<ProgressTemplate>
<div id="lblLoadingApi" runat="server">
Loading...
</div>
</ProgressTemplate>
</asp:UpdateProgress>
<asp:Label runat="server" CssClass="label searchResultLabel" Text="EXTERNAL SEARCH RESULTS" />
<asp:Repeater ID="rptApiResults" runat="server">
<!-- template in here -->
</asp:Repeater>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
However, the update progress control is never shown on page load or when the repeater is sorted or the page changes. How do I get it to show "loading" until all data is loaded in the repeater?
I was doing things wrong. The update progress modal will never appear on an asynchronous page load, due to it being already loaded before the page has rendered. As it was posting back when it was paging and sorting that's when the UpdateProgress appeared.
My solution was load it asynchronously after the page load (as it's in an update panel it doesn't affect the rest of the page), by using a piece of jQuery to click a "trigger" button on $(document).ready(...), which then went off to fetch the API results. This also set the UpdateProgress to visible which disappeared after the results had finished loading.
I am working on an app that loads modules (which are just user controls) into a single update panel. UpdateMode="Always". There is an UpdateProgress control with a gif that should display on postback.
For a few modules, the UpdateProgress doesn't show until the second postback from the module. So for example, the one module has a dropdown that posts back on change. If the user changes the dropdown before doing anything else, there will be no indication (no progress gif) that it is posting back. If the user then changes the drop down again (or any other postback), the UpdateProgress shows. Any ideas?
I've verified that it isn't just the drop down control and the initial postback takes long enough that the progress gif should show. UpdatePanel code below, module user controls are loaded in cphMain.
I am currently working around this by doing a __doPostBack in JavaScript when the module loads, but this is ugly.
<asp:UpdatePanel ID="upMain" runat="Server" UpdateMode="Always">
<ContentTemplate>
<asp:UpdateProgress ID="uPrgMain" runat="server" AssociatedUpdatePanelID="upMain">
<ProgressTemplate>
<h4>
<asp:Image ID="imgLoading" runat="server" ImageUrl="~/images/loading.gif" AlternateText="Loading" />
Loading...</h4>
</ProgressTemplate>
</asp:UpdateProgress>
<asp:ContentPlaceHolder ID="cphMain" runat="server">
</asp:ContentPlaceHolder>
</ContentTemplate>
</asp:UpdatePanel>
I have a following implementation in an asp.net application.
In abc.aspx i have this tag:
<ajaxToolkit:ModalPopUpExtender popupControlId="pnl">
<asp:Panel id="pnl">
<iframe src="example.aspx" id="fr2">
</asp:Panel>
Now the example.aspx has a PopUp Control Extender as like this
<asp:Textbox id="txt">
<asp:UpdatePanel id=udp>
<ContentTemplate>
<asp:Button/>
<asp:CheckBoxList>
<asp:Button/> .
</ContentTemplate>
</asp:UpdatePanel>
<ajaxToolkit:PopUpControlExtender targetControlId="txt">
</ajaxToolkit>
Now that PopupControlExtender in example.aspx runs fine when it is normally rendered as an aspx page.When the Page is Implemented as above in an iframe,in IE10, the PopUp Control Extender Doesnot Work as Desired.But it Works Fine In compatibility modes of IE as Well as Normal modes in Firefox,Chrome and Safari.
Please Help on this ..
Well, i have this in my master page
<cc1:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" ScriptMode="Release" />
And this in a usercontrol
<asp:UpdateProgress ID="updateProgress1" runat="server" AssociatedUpdatePanelID="CustomerListUpdatePanel" DisplayAfter="0" DynamicLayout="false">
<ProgressTemplate>
<asp:Literal ID="loadingLiteral" runat="server" Text="<%$resources:Label,Loading %>" />
</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel id="CustomerListUpdatePanel" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="SearchButton" EventName="Click" />
</Triggers>
<ContentTemplate>
<asp:repeater id="CustomerListRepeater" runat="server">
Problem here is that when i press the SearchButton the update panel updates but the UpdateProgress does not show it self, even if it takes a few seconds.. [somewhat solved by Yuriy Rozhovetskiy].
Problem is that the child buttons inside the updatepanel do not cause a total postback, instead they only reload the update panel, so it seems ChildrenAsTriggers="false" does not work or im miss understanding it.
Im using AjaxControlToolkit 4.1.50731.0.
Edit: also the UpdateProgress seems to display it self if a button is pressed inside the update panel...
Associating an UpdateProgress with an UpdatePanel Control:
The AssociatedUpdatePanelID property has the following effect on
UpdateProgress control behavior:
When the AssociatedUpdatePanelID property is not set, the
UpdateProgress control is displayed for the following postbacks:
Postbacks that originate from inside any UpdatePanel control.
Postbacks that originate from controls that are asynchronous
triggers for any UpdatePanel control.
When the AssociatedUpdatePanelID property is set to an UpdatePanel
control ID, the UpdateProgress control is displayed for postbacks
that originate from inside the associated UpdatePanel control.
Not sure about #Problem 1.
Regarding #Problem 2... I think your understanding might not be correct.
http://msdn.microsoft.com/en-us/library/system.web.ui.updatepanel.childrenastriggers.aspx
I'm trying to display an update progress loading image whenever my update panel does it's Ajax thing. I've looked around at tutorials and it seems really straightforward but I'm having no luck. Here is pretty much what I have...
<div id="panelWrapper">
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:UpdateProgress ID="TaskUpdateProgress" runat="server" DynamicLayout="False" AssociatedUpdatePanelID="UpdatePanel1" DisplayAfter="0">
<ProgressTemplate>
<asp:Image ImageUrl="~/Images/ajax-loader.gif" Width="16px" Height="16px" runat="server" ID="TaskLoadingImage"/>
</ProgressTemplate>
</asp:UpdateProgress>
<div id="UrlDiv" class="URLNotification">
<asp:Label ID="UrlLabel" runat="server" Text="URL:" AssociatedControlID="Url" />
<asp:HyperLink ID="Url" runat="server" Text="Click "Generate" to create the URL." />
</div>
<br />
<asp:CheckBoxList runat="server" ID="IncludeItems" TextAlign="Right">
<asp:ListItem Selected="True">Include 1</asp:ListItem>
<asp:ListItem Selected="True">Include 2</asp:ListItem>
</asp:CheckBoxList>
<br />
<div id="buttons" style="display:inline;">
<asp:Button ID="Generate" runat="server" OnClicked="Generate_Clicked" Text="Generate" />
<asp:Button ID="Add" runat="server" OnClientClick="add();" Text="Add"/>
</div>
</ContentTemplate>
</asp:UpdatePanel>
I also have some absolute positioning styling in a stylesheet. I've tried a bunch of variations of what you see here and have not found much good information as to what may be the issue. Any ideas? If you need anything else, let me know.
EDIT: The only new information I've found is that...
"In the following scenarios, the UpdateProgress control will not display automatically:
The UpdateProgress control is associated with a specific update panel, but the asynchronous postback results from a control that is not inside that update panel.
The UpdateProgress control is not associated with any UpdatePanel control, and the asynchronous postback does not result from a control that is not inside an UpdatePanel and is not a trigger. For example, the update is performed in code."
I'm pretty confident neither of these fit into my case. All that is happening is the button (which is inside the update panel) is clicked calling some code behind which set's the URL text to be reloaded for the update panel.
I have also the same problem with the UpdateProgressPanel.
I found out that when you have placed an UpdateProgressPanel and associated it to an UpdatePanel, any postback from that UpdatePanel will cause the UpdateProgressPanel to show.
Another trick to do is to remove the AssociatedUpdatePanel parameter if you have a single UpdatePanel on the page, this will cause the UpdateProgressPanel to show every Async PostBack that happens.
UpdateProgressPanel can be placed anywhere in the code, except those areas that have predefined tags on it. It can be placed inside or outside the UpdatePanel and it will show if you have properly placed its CSS, Associated it to an UpdatePanel or just place it there and it will show up if an async postback result happens.
Don't put the update progress control inside the update panel control
Make sure the UpdateProgress 'DisplayAfter' is set up to 1000 (1 sec)
I guess I figured out what was going on. The issue wasn't with anything I was doing wrong with the UpdateProgress or Panel. It was that I had other stuff loading in the background that was apparently holding up the UpdatePanel's Ajaxyness.
So basically what happened was that the loading icon wouldn't show up on the initial page load. I realized this because I actually waited till after everything on the page was completely loaded to fire off the button. Sure enough the loader showed up.
I assumed that the update panel refresh would at least be requested the instant the click event was heard so the loader icon would immediately show during the time other stuff is loading. This doesn't appear to be the case though...
I was having really hard time after converting my project from VS2008 to VS2010. The UpdateProgress stopped working suddenly, which was fine in VS2008. Spending a whole afternoon to search the answer and experimenting this and that, finally I found what went wrong from Scott Gu's posting.
It was an automatically generated web.config entry 'xhtmlConformance mode="Legacy"'.
After disabling this, it started to work again. May be not the case for you but just for guys struggling with the same problem.
Happy coding
I also had a problem with the UpdateProgress not showing. Turned out the postback to the server was actually so fast it never had time to show. Adding a Thread.Sleep(10000) helped show the problem.
Create a new ASP.NET Ajax-Enabled Web Site and then paste these code in ascs and aspx file. Run it and you can see the update progress. You can use animated gif files too to show the progress...
ascx Page:
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>UpdateProgress control</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdateProgress runat="server" id="PageUpdateProgress" AssociatedUpdatePanelID="Panel">
<ProgressTemplate>
Loading...
</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel runat="server" id="Panel">
<ContentTemplate>
<asp:Button runat="server" ID="UpdateButton" OnClick="UpdateButton_Click" Text="Update" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="UpdateButton" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
</form>
</body>
</html>
aspx Page:
protected void UpdateButton_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(5000);
}