...

View Full Version : How to force dynamic content to screen, client-side only?



zeekerzulu
12-12-2009, 09:20 PM
Hi All,

I'm working on a javascript-only application that queries an in-memory database, at times requests (all internal to the JS app) are lengthy, so I need to post a "Processing..." overlay atop the clicked UI tab to provide user feedback that something is actually happening. For the life of me I cannot figure out how to push the "Processing..." content to the screen while the DB lookup is underway. It appears that there's only one shot at updating the display, and that's when all JS processing has concluded (ie, the data has been looked up and is displayed). Any tips would be greatly appreciated, what I wish to do may not be possible?

Thanks in advance for your assistance!

JD

gusblake
12-12-2009, 10:18 PM
Hi, unfortunately none of this means anything to us with no actual code included.

zeekerzulu
12-12-2009, 10:55 PM
Fair enough. I was fishing for more of a general feedback, like "use this function to ....", however, you have a good point, you are working blind on this...

Here is the <td> for the GUI tab that is clicked to initiate the DB search:



<td id="search_results_tab" width="260px" class="tab-inactive-results" onclick=" _displaySearchResults ( 'tab' ) ;return false;">
<span id="search_results_label"><strong>Search Results</strong></span>
<span id="search_results_loading_msg" style="display:none;"><strong>Processing...</strong></span>
</td>


And here is the start and end of the _displaySearchResults () function call, as you can see, I'm just simply hiding and showing the various bits to post the "Processing..." message. The end result of all this is I never see the "Processing..." label, that's the issue...




function _displaySearchResults ( _origin ) {

$ ( 'search_results_loading_msg' ) .style.display = '' ;
$ ( 'search_results_label' ) .style.display = 'none' ;

... DB lookup and results render logic is here ...

$ ( 'search_results_loading_msg' ) .style.display = 'none' ;
$ ( 'search_results_label' ) .style.display = '' ;
}



Cheers,

JD

zeekerzulu
12-13-2009, 02:04 AM
More poking around on the web resulted in finding the solution. I just have to post an event (via setTimeout()) that performs the DB search and results display. Prior to the event call I post the "Processing..." message. Pretty simple, actually, just what I was hoping for. :)

JD

Here's the code:



<td id="search_results_tab" width="260px" class="tab-inactive-results" style="background-color:#FF9900" onclick=" _displayProcessingMessage ( 'search_results' ) ; setTimeout( '_displaySearchResults ( \'tab\' )', 0 ) ; return false;">
<span id="search_results_label"><strong>Search Results</strong><span id="showTimeMetrics"></span></span>
<span id="search_results_loading_msg" style="display:none;"><strong>Loading...</strong></span>
</td>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum