How to display dynamically growing table?

[xoinki]

hi all,

I have a content which is fetched from a JSON response. I am putting that in a dynamic table and showing the data. The problem with this approach is, I am adding row by row and finally appending that to a table, so if result set is large then browser struggles a lot to display and takes some time to display whole result in one shot. Instead of this if we can display the table as a growing table with rows displayed as and when rows become available.

http = new yXMLHttpRequest();
http.onreadystatechange = function()
{
     if(http.readyState == 4 && http.status == 20)
     {
          // Table populated here
     }
} // Table is not displayed until control comes out of here..
 
.
.
.
http.send()
 

I am using IE 6 and asynchronous request.
any ideas? Please help

waiting for your reply,
Xoinki

[hsriat]

Use insertRow and insertCell instead of appendChild.

[xoinki]

hi,
Thanks for your quick reply, ok i will check this out.

Xoinki

[xoinki]

hi,
I tried with the above approach.. it is simple but i still have the same problem..once data is given to browser browser goes into a not_responding state..
My question is
1) When will the browser actually display the data? As soon as we do appendChild?

waiting 4 u r rep,
Xoinki

[hsriat]

Can you please show me the part of the code where you're creating your dynamic table?

And browser will of course show data as soon as you do append child. But if data is too much(too many rows), then there's a response time. That's why I told you to use insertRow so that each row can be displayed as soon as its inserted instead of waiting for the whole table to get filled first.