Hello all,
Ill try and make this short and sweet. I have the following Javascript
being executed when the user clicks a button
function myFunc()
{
-- Get some values from elements on the page
-- Send those values to the server using Ajax and retrieve a
DataTable.
-- Render the Datatable on the page for the user to view
}
This works wonderfully, except when im trying to retrieve a large
dataset (after, say 100 rows it begins to slow down. Under certain
circumstances I need to retrieve 500+). Now, im already working on
speeding up this process, but there is always going to be some waiting
if your asking for a ton of data. What im wanting to do is display a
message on the screen saying "Searching ... " and then change it to
"Complete .. " When im finished rendering the table to the screen. So I
made the following modifications
function myFunc()
{
document.getElementById("message").innerHTML = "Searching...";
-- Get some values from elements on the page
-- Send those values to the server using Ajax and retrieve a
DataTable.
-- Render the Datatable on the page for the user to view
document.getElementById("message").innerHTML = "Search
Complete.";
}
The "message" element is simply a <span>.
Problem is neither of those messages are being displayed until the
entire function is done.
I need to be able to display the first message right off, before
proceeding with the rest of the operation.
Any help greatly appreciated. 5 1981
Hoss wrote: function myFunc() { document.getElementById("message").innerHTML = "Searching..."; -- Get some values from elements on the page -- Send those values to the server using Ajax and retrieve a DataTable.
-- Render the Datatable on the page for the user to view document.getElementById("message").innerHTML = "Search Complete."; }
Problem is neither of those messages are being displayed until the entire function is done.
Assuming you are correct in your analysis, one way of overcoming this
to defer the processing a bit:
function myFunc() {
document.getElementById("message").innerHTML = "Searching...";
window.setTimeout(restOfMyFunc, 100); }
function restOfMyFunc() {
-- Get some values from elements on the page
-- Send values to server using Ajax and retrieve a DataTable.
-- Render the Datatable on the page for the user to view
document.getElementById("message").innerHTML = "Search Complete.";
}
Csaba Gabor from Vienna
Hoss wrote:
<snip> -- Send those values to the server using Ajax and retrieve a DataTable.
<snip> ... . So I made the following modifications
function myFunc() { document.getElementById("message").innerHTML = "Searching...";
-- Get some values from elements on the page
-- Send those values to the server using Ajax and retrieve a DataTable.
-- Render the Datatable on the page for the user to view
document.getElementById("message").innerHTML = "Search Complete."; }
The "message" element is simply a <span>.
Problem is neither of those messages are being displayed until the entire function is done.
I need to be able to display the first message right off, before proceeding with the rest of the operation.
You are using synchronous XML HTTP requests, which block the browsers UI
until the response is returned, and from that point on you are busily
processing the returned data, which doesn't give the browser much room
to be updating the display until it is done.
You solve this problem by using asynchronous requests instead, as then
the browser gets the chance to update the display while the XML HTTP
request is doing its round trip to the server.
Richard.
Richard,
Thank you for your reply. However, I am making my request to the server
using Ajax ... which is by definition asynchronous. Furthermore, the
crucial line of code is being executed before the server request is
ever started. I set the HTML element of hte page, THEN Im sending a
request to the server. So im not sure what you mean ...
Assuming you were right, and I need to make an asynchronous request,
how would do go about that?
Also, the other response was quite a hack and doesnt work besides ^_^ You are using synchronous XML HTTP requests, which block the browsers UI until the response is returned, and from that point on you are busily processing the returned data, which doesn't give the browser much room to be updating the display until it is done.
You solve this problem by using asynchronous requests instead, as then the browser gets the chance to update the display while the XML HTTP request is doing its round trip to the server.
Richard.
Hoss wrote: Thank you for your reply. However, I am making my request to the server using Ajax ... which is by definition asynchronous.
Not at all, it can behave like a normal or wait-for thread.
The "normal thread" will keep running and, when it finishes processing
it will "warn" you, the other one is similar to a function, it will stop
your code flow until it finishes.
Both of them have advantages, but the asynchoronous one should be chosen
always, since the synchronous one is a kind of "while(initialTime +
delay > finalTime);"
Assuming you were right, and I need to make an asynchronous request, how would do go about that?
The last parameter of the "open" method is a boolean which defines if
the calling will be asynchronous (true) or not (false).
--
Jonas Raoni Soares Silva http://www.jsfromhell.com
Hoss wrote: Thank you for your reply. However, I am making my request to the server using Ajax ... which is by definition asynchronous.
You would think so, but in reality quite a lot of what is called AJAX is
using synchronous requests. Probably because its authors cannot cope
with multiple sources of asynchronous input (the user and the server) or
the possibility that responses from the server could follow a different
sequence from the requests made for them.
The symptoms you describe should not be able to exist if your requests
really are asynchronous, but if you cannot be certain I definitely
cannot without seeing your code.
Furthermore, the crucial line of code is being executed before the server request is ever started.
That would not necessarily matter with a synchronous request.
I set the HTML element of hte page, THEN Im sending a request to the server. So im not sure what you mean ...
Assuming you were right, and I need to make an asynchronous request, how would do go about that?
By setting the third argument to the XML HTTP request's - open - method
to boolean true, and having an appropriate handler to deal with the
response.
Also, the other response was quite a hack and doesnt work besides ^_^
It is a hack but it does work, if you code it right. Though it is not
the best solution to the problem. You are using synchronous ...
<snip>
Please don't top-post to comp.lang.javascirpt.
Richard. This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics
by: Andy Fish |
last post by:
Hi,
I have a section of a web page that I want to be able to make appear and
disappear with javascript, with the things below it moving up and down as
appropriate. I'm not using absolute...
|
by: Jon W |
last post by:
This is a small table with hover on the table cells.
The first cell is setup to switch from div element to
input element by use of display:block/none. In IE, onclick
the input element is displayed...
|
by: dmiller23462 |
last post by:
Hi guys....I have absolutely NO IDEA what I'm doing with Javascript
but my end result is I need two text boxes to stay hidden until a
particular option is selected....I've cobbled together the...
|
by: Stefan Finzel |
last post by:
Hi,
is there a way to change the display property on Windows Mobile 2003 SE
Mobile/Pocket Internet Explorer? See following example.
Please note: visibilty property has the same problem.
Is...
|
by: ruby_bestcoder |
last post by:
Hi
Im having problem in firefox with display:none/block.
I have essentially 3 li elements. In each element there are a few
nested div:s. Clicking on one of the divs, makes another div to...
|
by: divya |
last post by:
I have a page name edit.asp which should expire immediately .The user
cannot open this page directly he has to provide a password for
entering this page.thus when the user enters edit.asp , it has...
|
by: John Kotuby |
last post by:
Hi guys,
I am converting a rather complicated database driven Web application from
classic ASP to ASP.NET 2.0 using VB 2005 as the programming language. The
original ASP application works quite...
|
by: Mel |
last post by:
Is there a way of displaying the id of the element under the pointer ?
Please dont ask why I need it, but I do, i found tools that needs
installation that provide the same funcitonality. However,...
|
by: removeps-groups |
last post by:
Now I'm wondering how to display 3 elements next to each other. I
came up with the following solution using float:left, but would like
opinions if this is the right way to go.
The idea is to...
|
by: taylorcarr |
last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
|
by: aa123db |
last post by:
Variable and constants
Use var or let for variables and const fror constants.
Var foo ='bar';
Let foo ='bar';const baz ='bar';
Functions
function $name$ ($parameters$) {
}
...
|
by: ryjfgjl |
last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
by: BarryA |
last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
|
by: nemocccc |
last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
|
by: marktang |
last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers,...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
| |