I am using the sencha grid component and sometimes after the grid completes rendering, it will overlap on top of components above the grid. For example, if I add a search box field at row1 and then the paging grid on row2. The paging grid will overlap the component in row1 so you can't see the search box.
Is there anyway for this component to refresh properly?
VerticalLayoutContainer container = new VerticalLayoutContainer();
container.add(new FieldLabel() new VerticalLayoutContainer.VerticalLayoutData(.99, .1, new Margins(2, 2, 2, 2)));
applicantGrid = new Grid();
container.add(applicantGrid, new VerticalLayoutContainer.VerticalLayoutData(.99, .8, new Margins(2, 2, 2, 2)));
So the field label (row1) will not get shown properly because the 'applicantGrid' is slightly overlapping the row1 field label.
Is there a refresh or something I can do to the 'Grid' widget to make it work properly.
Yes. The problem is in your layout data. Remember, values < 0 mean use the actual height/width, values from zero to including 1 are treated as percentages, and values over 1 are treated as pixels.
What you most likely want is 1.0, -1.0 for your first row and 1.0, 1.0 for your grid. This tells the first row to render at 100% width and actual height and the grid to be 100% width and take up all the remaining vertical space.
If you need to add anything else to your VLC, e.g., a paging tool bar, that would probably be 1.0, -1.0 as well but obviously depends on your needs/use case.
Give that a go and see if it fixes your problem. If not, you may need to call forceLayout() on the VLC after rendering but this is not always needed.