I am making a web app in asp.net using c# that collects a lot of information from http web services at one time. Since this data collection process takes 10-20 seconds, I want to display a small loading frame with a small rotating image.
To make this happen on one page, I have a div called loadingdiv for which I set the Visible property of to false during PageLoad. When my "find movies" button is pressed, the c# code is supposed to hide the content that was originally on the page, show the loading image while loading the web service information in the backend, then hide the loading image and bring up the data display div.
If I comment out the class that loads the data from the webservices, this works fine. But as soon as I add my web service information it completely skips over the loadingdiv.Visible = true line and just does the 10-20 second operation.
Here's the relevant lines of code.
protected void btnFindMovies_Click(object sender, EventArgs e)
{
//Hides the main content that contained search options for movies
thisarticle.Visible = false;
articlediv.Visible = false;
lblGenres.Visible = false;
ratingdiv.Visible = false;
List<int> gList = new List<int>(); //Genre List
/* Other code that goes through checkboxes to find out which genres
to search for in the movie search */
string title = "Movie Title Here";
Page.Title = title;
loadingdiv.Visible = true; //Shows loading div before completing search
MovieSearch search = new MovieSearch(gList); //Intensive web service use
(10-20 seconds)
loadingdiv.Visible = false; //removes the loading div from the screen
}
How can I get the loadingdiv to show up while my web service operations are going through?
Everything in that method happens before any response is served to the user. This means that the following happens:
The user clicks your button.
A request is sent to the server and a postback occurs.
During the postback, btnFindMovies_Click is fired. You set Visible = true, wait for the web services to return their information and then set Visible = false.
The response is served to the browser.
Because this is all done on the same request, nothing is returned to the browser until all of this is done, which effectively eliminates the loadingdiv.Visible = true; line entirely.
If you want a loading div to show while some server-side code issues requests to web services, you will have to use AJAX to make these calls asynchronously and use Javascript to hide/show the loading div accordingly.
The following looks like a useful introductory guide to AJAX:
http://www.simple-talk.com/dotnet/asp.net/ajax-basics-with-jquery-in-asp.net/
Related
I have this browsercontroller and wonder how can I scroll down to the bottom of the page? I don't know the right command for this one
Here is my part of my code
Browser browserController = new Browser(); //call browser controlle
Searcher searchKey = new Searcher();
browserController.browserCloser("iexplore"); //close all recent open IE to avoid issues
using (IE browser = new IE(browserController.URLData())) //original code but with time out exception
{
browser.AutoClose = false;
browser.WaitForComplete(40);
Thread.Sleep(20000);
}
I need to scroll down to the IE and wait for the item to load
this is the website I'm checking https://hpe.wd5.myworkdayjobs.com/Jobsathpe/
I need to load all the results in the page
Do not use Thread.Sleep() in UI thread. It usualy blocks any UI actions even these which was invoked just before this call. Use Timer instead.
Codebehind:
scrollTo method
create a control at the bottom of the page... and Focus
Client side:
scrollTo, scrollBy
I am currently working on a project in Umbraco that requires a multi-stage booking process.
During this process I have multiple models that act as each stage of the booking process. These all form part of an overall parent model which is used to drive the whole process.
When the first stage is submitted, the information on the page is passed to the controller, validated and processed. Once this has been done the user is directed back to the page and the second stage of the process is displayed.
I know this probably sounds a bit mental but trust me it is the way that you have to do in Umbraco with its custom routing.
The problem I have with this is my booking process is in the middle of the page and when the page reloads it scrolls to the top.
My idea was to capture the current scroll position of the page using Javascript and pass it into my model on form submit however to do this I would need to trigger the capture and injection of this data into my form when the user clicks the submit button.
Is there therefore a way in which I can disable the default behaviour of a button:
e.preventDefault()
Perform some logic:
var top = $('html').offset().top;
Then re-initialise the default behaviour of the submit button so that it submits after performing this logic.
$(this).unbind('submit').submit();
I have tried the following but it just seems to submit the form as if nothing is happening.
$(document).ready(function(){
$('#BKG_Next').on("click",function(e){
e.preventDefault();
var top = $('html').offset().top;
alert(top);
$(this).unbind('submit').submit();
})
})
Any help would be greatly appreciated.
After some digging and further exploring I came up with the following:
var sleep = false;
$('#BKG_Next').on("click",function(e){
if(!sleep){
e.preventDefault();
var top = $(window).scrollTop();
var $element = $(this);
$('#position').value(top);
setTimeout(function(){
slept = true;
$element.click();
}, 100);
}else{
slept = false;
}
})
I have a page that is processing data. It goes through a series of 10 steps. I want the page to display a status after each step. ie. after step 1 data processing done print "Step 1 done" then after step 2 data processing done add text "Step 2 done" etc. How can I do this using only C# without hard postbacks? Or do I have to use AJAX/Javascript or page postbacks?
I've been playing around with updatepanels. One around the whole set of steps. Or an updatepanel around each step and then calling button clicks pro grammatically. The only result I can get is for all the text to display at one time at the end of processing.
I've been racking my brain and have search google endlessly. Hopefully someone out there has an idea for me. Thanks!
I'd suggest using ajax -
Server Side:
up a new action method on your server (assuming it's MVC), use this action method to query the state of the task.
public string QueryStatus()
{
return Session["progress"].ToString();
}
When the task progresses to the next step, update a variable to indicate this (in database, or session).
Session["progress"] = "Step Four";
Client Side:
Periodically call the action method and update an element on the page accordingly.
<script>
$.ajax('/Server/QueryStatus').done(function(response)
{
$('#progressElement').innerHTML = response;
})
</script>
I have the following method that is called when reloading certain pages in my app. The point being to interrupt the current transaction, ask for authentication and call a specified function when coming back to the page to complete the transaction. State, and the method name are saved in Session in the interim.
After redirecting back to the page, the method executes and everything looks fine, but when clicking on a link to the same page it now just displays the same page, not a new page with empty fields etc. and, no page events fire. Eventually if I leave the page for long enough, maybe 5 minutes, it will refresh the page or clicking a button with a Response.Redirect call will do it.
Call the same page method normally w/o reflection and it looks to be fine. It seems as if using reflection may be keeping the page object in memory and not allowing it to be GCed. What is going on here? There are plenty of workarounds, but I'd still like to understand it for the future.
protected override void OnLoadComplete(EventArgs e)
{
base.OnLoadComplete(e);
if (IsRestoredPageState && priorPageState.CallingFunction != null)
{
var completeAction = this.GetType().GetMethod(priorPageState.CallingFunction);
completeAction.Invoke(this, null);
completeAction = null;
}
}
All,
I have an UpdatePanel that is making a couple of long-running request to gather a lot of data. Sometimes it takes up to 90 sec to return.
The first request returns data that is rendered as a link to a document. Clicking the link opens a new browser window and the URL has a query string that tells the system which doc to open.
Here is a snip of code when rendering the link for the client:
HtmlAnchor alink = new HtmlAnchor();
alink.HRef = "javascript:openDocument('"+ item.Url +"')"; //item.Url;
// here is the JS on the client page
function openDocument(path) {
window.open(path);
}
So, when the user clicks the link, the popup window does open. The problem is that it waits until the UpdatePanel is complete with its request before the popup window sends its request.
I can copy the url from the popup, open a new browser and then paste the URL into the new browser and it opens the doc as expected.
This leads me to believe that the UpdatePanel is somehow blocking the popup window's request. I'd rather not make the user wait until the UpdatePanel's AJAX request has completed before the user can open docs from the first result.
How can I work around this blockage? I've tried creating buttons outside of the ContentArea of the UpdatePanel and simulating clicks, but nothing like that works either.
Does anyone have an idea about this?
Thanks in Advance!
The reason is that the pages are using Session state so any request blocks all other that share the same session key.
If your page does not write to the session then you can apply IReadOnlySessionState attribute to them so that they only block if there is a non-readonly request and not if all concurrent requests are using read-only Session.
public class YourPage: Page, IReadOnlySessionState { ... }