Start Building Professional
Web Apps Today

Smart Rendering status or progress indicator

It would be great if there was some kind of indicator that the grid is loading new rows while in smart rendering mode. This is probably not very necessary for grids with just few columns (like most of your samples), but I have a complex grid with  40 columns and it usually takes about 1-2 seconds to render the next set of rows when the user scrolls down. If there was some kind of status indicator or progress to show when new rows are being rendered, that would be very helpful.  Perhaps something like in this KB, where the text dims and a "Loading" icon appears would be nice.

The dhtmlxGrid provides two events onXmlLoadingStart ("onXLS") and onXMLLoadingEnd ("onXLE"), which can be used for detection of loading. First event fire when any loading operation initiated ( including smartRendering loading steps ), second fire when data loaded and correctly inserted in grid.

You can check pro_dynload.html as a sample

Thanks. I just tried this, but it didn't work in smart rendering mode. It appears to only call the onXLE event one time. Am I doing something wrong? (debug() is just a util function that writes to my debug msg div).

var onXMLLoadingStartEventId=this.grid.attachEvent("onXLS", function(grid){
            debug('loading');
        });   

var onXMLLoadingEndEventId=this.grid.attachEvent("onXLE", function(grid){
            debug('loading done');
        });   

Do you use static or dynamic  smart rendering?
The event will fire only for dynamic one, in case of static smart rendering you can customize code to create custom events, but because of JS nature, the browser will not render view until js thread works, so probably you will not see you "loading" screen in such case.

dhtmlxGrid_srnd.js, function dhtmlXGridObject.prototype.__askRealRows- this functions initiates and finish additional rows rendering in case of static smartRendering, it can be used to add custom events

Ok. I use static smart rendering. So I guess this will not work for me. It would be great if there was an event that fired just before the grid is going to create new rows, and then fire another just after the rendering is complete.  But I guess it's true that when you generate new rows in DOM, there is no way to tell when the browser is finished doing painting, right? I'll bet there is some work-around that somebody has figured out.  Hopefully soon, this browser / rich client technology will catch up to where standard GUI technologies were 10 years ago!

>>there is no way to tell when the browser is finished doing painting, right?
Basically it can be done in next manner

    window.setTimeout(some_code,1);
    ...some js code which cause rendering...


Because of javascript nature, browser will start rendering in moment when current js thread finished, the code launched by setTimeout will be called only when rendering finished, and because it set to 1ms it will be called in most cases immideatly after rendering end.

The problem here that if you have next code
   
    show_my_flag()
    ...some_heavy_js_code...

the real reaction on changes in show_my_flag() funciton will be visible only when "some_heavy_js_code" finish work ( browser made changes in view, only when js thread finished ), so even if you show some king of message it will be shown only after all new rows rendered, that makes it pretty useless. Such approach works for dynamical loading because it async, and browser has time to render before XML with new data retrieved.

Well, actually, I don't need to see how many rows are being loaded incrementally ... I just want to display a message or maybe place a transparent div over the grid, just before smart-rendering is going to load new rows. Then, once the rows are finished rendering (which I can use the timer as you mentioned), I will remove the message or transparent div.

The only think I think I need from you, is an event that in static smart-rendering mode, fires just before the next screen of rows is going to be loaded.

Is there a way to do this now?  Show a loading message, or an event we can use to show thats it loading?  Using smartrendering (not dynamic).

In case of dyn. smart rendering both onXLE and onXLS fires , so any kind of message can be attached.
Static srnd. mode renders data in sync. mode, so it not possible to made any visible changes in browser before data will be rendered.