When is viewready event called?

Questions related to our Sencha Touch based grid component
User avatar
nickolay
Core Developer
Core Developer
Posts: 3466
Joined: Mon May 16, 2011 10:48 am

Re: When is viewready event called?

Post by nickolay »

We offer training in both Ext JS and our products, read more here.
Read the API documentation

User avatar
LarssaAndin
Posts: 18
Joined: Fri Mar 01, 2013 12:28 pm

Re: When is viewready event called?

Post by LarssaAndin »

nickolay wrote:Right, grid renders itself as soon as it appears in the DOM. If store is not yet loaded then grid will render empty content. But the "viewready" event will be fired anyway, since grid will finish all its initializations. Seems for your case a new event should be added "viewhascontent" or something similar. I've created a feature request for it: https://www.assembla.com/spaces/bryntum ... ilar-event (but not promise this feature yet).

How exactly do you calculate the column widths? Are your calculations based on a single row or several rows?
I'm thinking about something like - grid renders one hidden row (visibility : false) and fires this event. Then user can do some math based on the content of the row and change the column widths. Then the full content is rendered.
Sorry, didn't see this until after my last response.

viewhascontent event could be useful, but a refresh event that fires after every full loop over cell renderers should work even better.

What I do to calculate column width is that I know which cell has widest content (by guessing but it's close enough). When I render the cells I add an I to each cell using a span around the content. This is how I had to do it in the ExtJS implementation (that I heavily use as base for my touch solution atm). I might be able to optimize it a bit here and place the id in the cells td instead (does that sound feasible?). When the cells are rendered I can then run my fixColumnWidth function that loops over the columns, check the id of the widest cell (the column definitions come from the server so they include this info). I get the cells element using document.getElementById(widestCellId) and can then do
col.setWidth(element.offsetWidth + margin);

So far it's very quick, the rendering is so fast that the user doesn't even notice that change as it happens before it's visible. Only thing I've seen that would be nice to avoid is that the header renderer is run on all coulmns every time I change a columns width (at least I assume that is what is happening).

Ps. Not including my messy code here (still needs a few rounds of cleaning before I want to publish it publicly ;) ). Ds.

User avatar
LarssaAndin
Posts: 18
Joined: Fri Mar 01, 2013 12:28 pm

Re: When is viewready event called?

Post by LarssaAndin »

nickolay wrote:Ah, I see now. 1st "refresh" is correct - since refresh with empty store is still refresh, but we are missing one more refresh event after cells with content will be rendered. Thanks for the report, will be fixed soon!
Great :-) Sounds correct. I will just have to catch the case that the cells isn't rendered yet when fixing coulmn widths and it should work perfectly.

Post Reply