I have a web application with some pages take quite a long time to load because of what they have to do in code behind. I would like to show what is going on to the user by showing the different status of the process.
I was thinking about calling recursively (by ajax) a page which ready a value in the session. This value is set by the page that take time to load.
The problem is that the page called by ajax is not executed while the other page load is finished.
Is there some way to do that?
Thanks advance
The usual pattern here is to load an initial status page that triggers an AJAX call to retrieve the final version of the page, overwriting the original with the result of your AJAX call when it completes.
Separate the part of the code that takes a long time and call it asynchronously (e.g. as a WebMethod) on page load, e.g. if using jQuery, on document.ready. You could also fake this using an UpdatePanel which is set to conditional refresh, and the code is never run by default. Then refresh it from script using __doPostBack('updatePanelUniqueID','').
Related
I am using multi-threading to update/display the content of page. Page is using multiple ( and nested ) update panels. Right now, i am using following logic to update page.
I have seven threads, each thread gets data by querying database and display them in specific section of page. We start threads and wait for 2 mints, after passing 2 mints if some threads still working then we break those and display the populated data on page, these calls to thread are making on page load event.
Problem here is that we must need to wait for specific time before page load, and then after that time limit, page 'll be displayed with populated data. Users need to wait for long to see the page, which making a really bad impression.
If we remove the limit of 2 mints, then page rendered fast but it does not display all data.
What i want here, when we call threads, we don't need to wait for all, when one thread completes it should show its data on page, and as soon as other threads being complete then they should display their data accordingly.
I found solution of this problem after testing many techniques.
To implement this, we don't need to use threading. When we call a page, server makes an object of this page and perform all required executions and then it render this page, destroy its object on server and send rendered page to Client Browser. So after rendering we can't receive thread's response. To receive thread's response, we must have to stop page being rendered explicitly (it causes delay, which we don't want).
So our solution is using JSON Ajax API with Web Methods (with Serialization and Deserialization if you are dealing with complex objects).
We have to load page with all controls on it, onload event of page, call javascript method which call Web Method using JSON API, after receiving response from Web Method, we have to update respective controls using JavaScript/JQuery manually.
I have a performance issue where we have a 2 page setup as part of a workflow in a bigger system. This section is dedicated to rendering reports allowing users to chose their own parameters.
Page1.aspx collects parameter information for a report. It takes the information submitted on a form and validates it. If it validates OK, it stores the selections in the DB as XML, then redirects to Page2.aspx with the run id in the query string. Simple enough, performance is great.
Page2.aspx pulls the ID out of the DB and hydrates a Crystal ReportDocument object (taking milliseconds) then we call ExportToHttpStream which then renders the report as a PDF or DOC or XLS download (output format is determined in Page1.aspx). The performance of the ExportToHttpStream method is very poor due to the way our reports are written and DB indexes on the target system. This is outwith my control at the moment but I am promised that they are being worked on.
So the problem is, that when the submit button in Page1.aspx is pressed, the user experiences a very long delay before the download starts. It is then compounded by the user pressing the submit button again thinking there is a problem.
I think what I need to do is have Page1.aspx redirect to Page2.aspx. Page2.aspx should render the master page furniture and a loading div, and the report should render asynchronously somehow in the background before the save dialogue automatically pops up, after this i'd like to change the loading div to a 'Report generated, click here to go back'.
If this is the best way to achieve this, how can I load a full page, then request the report asynchronously? I'm open to any suggestions here.
You could use ajax to load the report on Page2.aspx and show a loading message while it's processing.
Look at the jQuery.load() method. This might be the easiest way to accomplish what you are trying to do.
Page1.aspx - collect parameters
Page2.aspx - report view, calls Page2Details.aspx via ajax.
Try loading Page2.aspx inside iframe and use jQuery to display waiting indicator and hide it after Page2.aspx download
Whilst both answers gave me some ground to go out and research in the right direction. My solution included using the fileDownload plugin from John Culviner to facilitate a similar solution:
jQuery fileDownload by John Culviner
This allowed me the following page structure:
Page1.aspx, gathers and validates parameters for the report and puts them into Oracle.
Page2.aspx, whilst passed in the runid (pointer to the parameters in the db) via the query string setup 3 hidden divs. Loading, Error and Success.
The script mentioned above was employed at this point. jQuery firstly sets the loading div visible then calls the plugin. The plugin dynamically creates an iframe and downloads the binary (xls/doc/pdf) from Page3.aspx. It then fires a success callback or failure. The success callback is fired by means of a cookie set at the end of the response in Page3.aspx.
I believe the plugin mentioned downloads using a 'text/plain' AJAX call in jQuery avoiding the limitation of there not being an octet-stream equivalent in AJAX.
It works, its not the cleanest solution by any means, it doesn't degrade one bit, but provides the users on our controlled intranet with an extremely responsive and pleasing UI.
I have a requirement to call a save method, that persists a model/object in the session, when the user leaves the page.
The page has various links that do not raise a postback but just perform a redirect. Are there any ASP.Net page life cycle methods I can hook into to perform the save without requiring a postback?
One solution could be to perform an asynchronous POST request (without waiting for a response) when the window is being unloaded:
An example using jQuery:
$(window).unload(function() {
$.post(location.href, $(document.forms[0]).serialize());
});
Although you will probably need to use a slightly different method for Chrome (found on jQuery forums):
It looks like the only way to get the
Ajax request to go through in Chrome
is to use the non-standard event
onbeforeunload. Chrome evidently
doesn't wait long enough to send the
Ajax request using onunload. It does
however wait for alerts...
Well that depends.
If you need to save values when the person leaves the page, then thats kinda hard.
What you can do, is to wrap all your links in some jquery, that says like:
Issue a Ajax Call, to AjaxSave.aspx, then it is completed, then window.location to the links href attribute.
BUT, that will only work if the person clicks on your links, not if the person just closes the browser or something.
You can also take the route to just save the stuff offen, so every time the person issues a post back, you just put the stuff in session. But that will mean that values changed from the last postback to the navigating away from the page is lost - don't know if that is an issue.
The last thing is to do like StackOverflow is doing. If you are editing stuff, it will show a warning when you leave the page, and then you have to click okay, to navigate away from the site.
I'm having the same problem I had yesterday... The solution Aristos provided helped solve the problem, but I have other places sending updatepanel postbacks causing the same problem.
When an update panel is updated and another request for an update is called before it has a chance to render the first updates, the entire page refreshes instead of just the update panel.
I used fiddler to see what was going on and here's what happens... If I wait for the request to return before doing another request I get this:
21443|updatePanel|dnn_ctr1107_CRM_SalesTool_LeadsUpdatePanel|
But if I don't wait, I get this:
66|pageRedirect||http://mysite.com/salesdashboard.aspx|
The code from the previous question is still the same except I added UpdateMode="Conditional" to the update panel.
Any ideas? Or is the only solution to this making sure that 2+ updates for any number of update panels (as long as they're on the same page) never happen?
Thanks,
Matt
Maybe microsoft automatic ajax can not handle 2 request at the same time because he needs to know what is the post back every time, so probably if you click when he wait for a return, then he knows that the post back, has change, so he by pass ajax to be soure for correct return.
I can think 2 ways. One way is to make it by your self using jQuery and ajax and avoid UpdatePanel.
Second way, is to block the clicks when you wait for the return, or make a mechanism to place the request, the one after the other.
This code can help you know when you block the input and when you release it, or do what ever you think.
$(document).ready(function() {
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_initializeRequest(InitializeRequest);
prm.add_endRequest(EndRequest);
});
function InitializeRequest(sender, args) {
LastIdCaller = args.get_postBackElement().id;
}
function EndRequest(sender, args) {
}
I could be wrong, but if I'm right then you can't do multiple ajax request if you are using asp.net WebForms. In asp.net WebForms there is only one Form element on a page. Multiple ajax requests on the same page require multiple form elements for each. Html is designed to post back inside a form element and the mechanism that handles said postback is the form, it's the container. Only one can post back at a time. So because Asp.Net WebForms only has one form element per page, you can only do 1 ajax postback per page.
Optionally, you can create generic ASHX Http Handlers to do your form logic and use JQuery Ajax to post back to the Generic Http Handlers. In which case you can do as many of those at a time as you want.
Generally I use ASHX handler's any time I need to serve images that change, like on the fly imaging. I also use them for large data outputs. E.g. the ASHX handler returns a big dump of JSON. I do an Ajax Postback to the ASHX handler to get a set of data in JSON and append it to a table etc and I call the ASHX handler repeatedly on a timer to get new Data as it comes in (say a 5 min timer) etc.
If you gave some more context on what your trying to do I might be able to provide you with alternative solutions.
Edit: I looked at your other post you linked and I think an ASHX handler would serve you well. You can design the ASHX handler to return your Search Data in JSON. You can use Request varaibles in the ASHX handler and you can send post data to the ASHX Handler with JQuery.Ajax.
You should be able to fire off multiple requests each with it's own Success Function. Then you would need to write the javascript in such a way that as it's processing the JSON data from the ashx handler it can merge with other requests as they finish.
Here's the odd situation:
we have a piece of javascript library that is being called on our onload of aspx page.
It works everytime for us, but the clients that have low speed modems get an error, because the object is not getting initialized and the aspx page is already loaded.!!
Is there any suggestions on how to call this piece of js code?
Thanks,
make sure you have your end tags.. i have seen onLoads in the not working right when your core tags are incomplete or not properly formatted
The onload even happens when everything in the page is loaded. If you have some script that is loading from a different server (ads, statistics), the onload event won't fire until those are loaded also. If their server is having problems, your onload may never fire at all, or after several minutes when the browser gives up waiting.
Instead of using onload you could put your code in a script tag as early as possible in the page, i.e. after the last element that the script needs.
If you have some external script that doesn't need a specific place in the page (statistics for example), you can move it to the bottom of the page to minimise the risk of interference with the rest of the page.
With JQuery you can call your functions with ready event :
$(document).ready(function() {
// call your functions here
});
The event will be called when the DOM is loaded.