WebPage transitions?

I have a web app with two pages. The first page has a listbox. Clicking a cell loads the second page with details pulled from a database. The second page can take several seconds to load which can be confusing and/or frustrating for the user. They end up clicking several times thinking the app isn’t responding. I’d like to cover the first page with a semi-transparent rectangle as a sort of dimmer and a progress wheel to let them know that something is happening.

I am having a problem getting the dimmer and wheel to display. In the cellclick event of the list, I set the rectangle’s and wheel’s Visible properties to true, but neither displays. I think what’s happening is that when I call the Show method for the second page, the first page immediately stops processing and doesn’t have time to refresh and display the rectangle and wheel before relinquishing control to the second page, even though it takes several seconds for the second page to actually display. Or something like that.

I have tried several ways to pull this off, but nothing is working. I have not tried setting up a thread with a timer. I’m not sure that would solve the problem. Has anyone tackled this problem?

You could so something like this (there are for sure other ways too).
A click on the listbox shows Page2 which in its Shown event displays the dialog with the progressbar and starts a Timer on Page2 with a short period. This timer will load the data that is taking so long.
The timer should make room for the dialog to display properly prior to loading of the data.

Just something I think could work. If there’s a better option, I hope someone chimes in :slight_smile:

[quote=66511:@Albin Kiland]A click on the listbox shows Page2 which in its Shown event displays the dialog with the progressbar and starts a Timer on Page2 with a short period. This timer will load the data that is taking so long.
The timer should make room for the dialog to display properly prior to loading of the data.[/quote]

Yes! Thank you!

I was going about it backwards. Instead of having the first page display a spinner while the second page loaded, the second page should load with the spinner already visible while the data loads behind it inside a timer. The last thing the timer does is hide the spinner.