ASP.NET, Showing Loading message while Postback - asp.net

I have an ASP.NET page which has an asp.net button control in it. When the user clicks on the button, the page will do some calculations and then close itself, but when I click on the button during post back, the page shows a blank screen. I want to show a loading message instead of this. I used javascript to show a div which was hidden intitially and shown when the user clicks the button, but when the post back happens, the screen becomes blank. Any idea how to show the loading messsage in this scenario?
Thanks in advance.

Do you really need to avoid ASP.NET ajax or JQuery?
If so: move the heavy processing into an invisible IFRAME. Action your form to the invisible IFRAME, or use javascript to set the location of the IFRAME.
Your 'loading' javascript will display fine. When the form inside the IFRAME completes it just needs to output some javascript to tell the 'parent' to go to location or refresh.

If you use Ajax to post back to the form asynchronously, you can use the UpdateProgress control. Here is a link to an article explaining how to implement the functionality:
How to make a Gmail-like loading indicator with ASP.NET Ajax

Basically, you can't using just postbacks. The browser draws the screen white while waiting for a response from the server. That message you set to show when the user clicks a button was the correct approach (so good work).
But the browser drew the screen white, thinking "Oh boy I'm about to get a response!" and then waited for longer than you think is appropriate.
The only thing you could try would be, in the response, make the very first thing to stream to the browser some sort of loading message that the browser can display while loading the rest (like the gmail loading screen). But personally, I think you could spend your time doing some other development.
You could try other techniques with AJAX though.

Related

Maintain Scroll Position with response.redirect function

I have one main page in my asp.net website.
In that page i have used gridview with hyperlinkfield.
on click of any of hyperlink, application will redirecting to detailed page.
on coming back to main page i want to hold scroll position instead of i am getting top of page.
i have tried maintainscrollposition script but its not working.
i also have used master page.
i have used button on detailed page and onclick i have used response.redirect.
How can i maintain my scroll position in this scenario ?
Since you are leaving the page and coming back, you cannot store in data in javascript or the ViewState. This leaves you with two options:
Save the scroll position in a session variable. You will have to use a hidden field to send a javascript variable to the server to save it.
You could also use a cookie with an appropriate expiry time to remember the scroll position. Using a cookie allows for a pure javascript solution.
Using a cookie is a simpler and better option in my opinion.

Preserve selected option with back button, using jquery mobile & asp.net & ajax

I thought this would be a trivial feature, but I have lost a fair bit of hair trying to figure it out. I have a jquery mobile web page with a select menu. Users click an item in the drop down list, then later click on a link and navigate to another page. Users then click the back button. The desired result is that the selected item remains selected. Right now, the selection is lost, and it defaults to the first element in the list again.
Things I've tried:
1) Use an asp.net dropdownlist with autopostback. This preserves the selected option, but then I get a page flicker because the entire page is posted back.
2) Wrap above asp.net dropdownlist in an updatepanel. This preserves, doesn't flicker, but it wipes out the jquery mobile styling. Also tried some suggested workarounds with firing a jquery create event, but couldn't get anything working.
3) Write cookies on the select change event in javascript, and read them in the asp page_load event. However, page_load is not called when the back button is clicked, so this had no effect.
4) Tried creating a jquery ajax request to a web page method, but the method must be static and therefore I can't get it to modify the page.
Any other ideas? Is it just me or should this indeed be a problem that's been solved a million times?
As an FYI, I am a newbie at web programming, so please spell it out if you have an answer :) (come from a c++/database background).
Thanks!
Turns out even the date scroller could not survive a back button in some cases. For example if the user navigates to another site, and then uses the back button to come back to my jquery mobile site, all my javascript dom manipulations are lost. The solution is non-trivial. I store everything I need to maintain state of a page using html 5 local storage. On the jqm show page event, I detect if all my global variables have been wiped clean, and if so, reload state from local storage. Works perfectly, but it is quite an implementation task. And of course, if local storage is not supported by underlying browser, it all falls to pieces.

Redirection from a Telerik Rad Window

In an asp.net web application, I have a modal popup built with a Telerik Rad Window. In that popup there is a button which must do some action in its "code-behind" and then redirect the application to another page.
For the redirection I use the javascript command 'top.document.location.href = myPage' (sent to the browser from the code-behind with a ScriptManager.RegisterClientScriptBlock(...)).
This solves my problem but it is not very nice. When the button is pressed, this triggers the post-back. In the browser the popup is covered by a RadLoadingPanel which disapper when the post-back is finished. Then during a few seconds, nothing happens in the application and it is only after some time that the browser loads the new page.
The fact that nothing happens during a few second is not great since a user cannot know what the application is doing.
What can I do ? Is there a better way to do the redirection ? (I'm very new to javascript programming...).
Instead of just calling 'top.document.location.href = myPage', you can call a function that displays an overlay (e.g. show a RadAjaxLoadingPanel over the parent page body) and then set the new URL. See http://www.telerik.com/help/aspnet-ajax/ajxshowhideloadingpanel.html for info on how to show loading panels with JavaScript.
I think the delay after you set location.href is normal - the browser/server take some time to retrieve the new page HTML so the old page cannot go away instantly.

Dynamic web user control problem when browser's back button is clicked

I have an .aspx page in which I dynamically add web controls to a panel.
The problem is when I hit the browser's back buton, it's displayed a version of the page that no longer exists on the server-side, because the controls are dynamically added.
Let's say my aspx dynamically adds Control1. From there, I click a button that loads Control2.
At this moment, if I press the browser's back button, it will display the page with Control1, but Control1 no longer exists on the server-side, so if I interact with it, some erractic behaviour will occur. Any ideas on this?
Thank you very much.
Have you tried setting the client side to not cache pages - stick this in your page load:
Response.Cache.SetCacheability(HttpCacheing.NoCache)
(Think the syntax might be slightly off, but you should be able to figure it out)
Have you tried with removing temporary files and restarting browser. Your page might be cached in browser.

Using XMLHttpRequest to display a popup

I am writing an ASP.NET 3.5 web app that displays a list of items. I want to be able to display a non-modal popup with details when the user selects an item. I want to be able to display several detail popups simultaneously. (i.e., the user can click an item to see its details, then click another item to get another popup.) Currently I call RegisterStartupScript during postback to write a "window.open(...)" script to the page when it re-renders. The problem, of course, is that this requires a full page postback and refresh.
It occured to me that this might be a perfect use for XMLHttpRequest or AJAX but I don't know how to do it (or whether it's even possible or smart to do this). Can someone show me the way?
I have the AJAX Extensions installed but I'd prefer not to use the AJAX Control Toolkit.
EDIT:
Some clarification: When the user selects an item a custom event is raised. On the server I handle this event and use some server-side logic to construct a URL which I then use with RegisterStartupScript to construct a "window.open(myUrl...)" script. But posting back the whole page to do this seems inefficient and I'd like to know if I can just make a call to a simple server-side function that constructs the url and sends it back without having to roundtrip the entire page.
Creating a popup has very little to do with AJAX, and a lot more to do with JavaScript. See the jQuery dialog library here. You can then use jQuery's AJAX API to do your server dirty work :)
jQuery Dialog UI
--
Bill Konrad
Devtacular - Web Development Tutorials
You can use DHTML Window widget.
It offers many way to display either modal or non modal window.
Also it supports AJAX.
You can use dhtmlwindow for open a new window, or
dhtmlmodal to open a new modal window.
Of course, you can edit it to match your requirement.
Sample:
var insWindow = dhtmlmodal.open("insbox", "iframe","UserMaster.aspx?" + queryStr, "User Master", "width=425px,height=500,center=1,resize=0,scrolling=1", "recal");
Do you really need to open a new window? Opening an absolutely positioned DIV or a new layer on top of the current page in the same window is all the rage these days.
Edit:
I don't think it would limit the number of popups, there is some neat stuff that can be done these days with libraries like jQuery + jQuery UI, you can simply create as many of these DIVs/layers as you need and make them movable, resizable, etc. Only thing that real popups have and these do not is that they do not appear on the tab panel/taskbar.
Yes, you will be limited to the size of the window in which is the main page opened, however, I don't personally see it as a problem since most people surf in a maximized browser window anyways.
Implementation of the oldschool typical popup window is undoubtedly much easier for you, but it also runs into problems with end user popup blockers. Just had that problem # my work, they needed to make a popup during the certificate authentication process for some reason and as soon as Yahoo released a new version their toolbar, it quit working).

Resources