Hi all,
I have a page that display a large dynamically created image (server side script) that can take a while to be generated (say about 2 seconds). Pressing a button I want the image to be refreshed.
I included the image and the button in a UpdatePanel to avoid flicker, but I don't take the effect I want as images are loaded asynchronously by the browser after the UpdatePanel completes.
Is there a solution to avoid this?
Thanks in advance
Here's the simple code I used:
<htmlxmlns="http://www.w3.org/1999/xhtml">
<headrunat="server">
<title></title></head>
<body>
<formid="form1"runat="server">
<div>
<asp:ScriptManagerID="ScriptManager"runat="server">
</asp:ScriptManager>
<asp:UpdatePanelID="UpdatePanelMain"runat="server">
<ContentTemplate>
<imgalt=""src="testimage.aspx?<%=DateTime.Now()%>"/>
<asp:ButtonID="ButtonRfreshImage"runat="server"Text="Refresh"/>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form></body>
</html>
Hi,
I think you need to block the execution of button click event until the image is generated successfully so that the changes can be reflected on the client.
For instance:
btnClick()
{
generateImage();// call this method synchronously
}
Hope this helps.
This is what I do, my code was only an example to demonstrate the behaviours.
What happens in any case is that, if the image is big enough and the connection is slow, the page will be refreshed before the image is completely received because the browser download it asynchronously.
I solved this using two images, one invisible and the other as a placeholder: I refresh the invisible image and when it is complete I reassign the .src of the placeholder image to load the some URL: the file is now in the cache and it happens immediately .... but I think it's strange Ajax doesn't support this directly.
No comments:
Post a Comment