CODEWITHSUNDEEP
gwtlayoutgridgxt
ovie
ovie

Reputation: 621

GXT Grid does not fit panel

I am developing an App with GXT and I am using gxt grid widget. But I have a problem of layout, my grid "content" doesn't fit my ContentPanel (especially in height). Here is a screenshot of the problem.

enter image description here grid layout problem, it does not fit panel

And this is my code:

public abstract class GenericEditableGrid<M> extends Grid<M> {
    private final VerticalLayoutContainer gridContainer = new VerticalLayoutContainer();
    private final ContentPanel pane = new ContentPanel();

    public GenericEditableGrid(String gridTitle, ListStore<M> listStore, ColumnModel<M> cm) {
        super(listStore, cm);

        pane.setHeadingText(gridTitle);
        pane.setHeight(150);

        this.getSelectionModel().setSelectionMode(Style.SelectionMode.SINGLE);
        this.getView().setAutoFill(true);
        this.getView().setAdjustForHScroll(true);
        this.setBorders(false);
        gridContainer.add(toolBar);

        // --------------- EDITED --------------- //
        // This is where I add my grid. I think the problem is here.
        // There should be a VerticalLayoutData here but there is an exception
        // thrown if I add the LayoutData
        gridContainer.add(this/*, new VerticalLayoutData(1,1)*/);
        pane.add(gridContainer);
    }

    @Override
    public Widget asWidget() {
        return pane.asWidget();
    }
}

When I use my grid I do it that way:

requiredFields.add(creationTime.asWidget(), new VerticalLayoutData(1, 1, new Margins(0, 0, 10, 0)));

I have tried many things including using setHeight("auto"), addStyleName with a custom css, setAutoFill(), setAdjustForHScroll(), ... Also just tried to add this.getView().setForceFit(true); as recommended in another SO thread. But I still can not solve it.

Here is the exception thrown:

com.google.gwt.core.client.JavaScriptException: (HierarchyRequestError) @com.google.gwt.user.client.impl.DOMImplStandard::insertChild(Lcom/google/gwt/user/client/Element;Lcom/google/gwt/user/client/Element;I)([JavaScript object(1450), JavaScript object(1428), int: 0]): Failed to execute 'insertBefore' on 'Node': The new child element contains the parent.

Could any body help me go through this?

Upvotes: 0

Views: 1229

Answers (3)

Darek Kay
Darek Kay

Reputation: 16709

As other people already stated - it's not a grid problem. It's a container problem. Check the place, where you add the Grid to your VerticalLayoutContainer. This method should look like this:

verticalLayoutContainer.add(grid, new VerticalLayoutContainer(1, 1));

The second parameter gives the full width and height available. If this doesn't work, you have to check the parent containers. For example: if your VerticalLayoutContainer has a width = 100px, then your grid won't get any bigger, even if you give it the full height (because full = 100px here). In that case, you have to give your VerticalLayoutContainer more space:

verticalLayoutContainerParent.add(verticalLayoutContainer, new VerticalLayoutContainer(1, 1));

If you're using BorderLayoutContainer, put your grid in the center - this gives the grid full width and height automatically.

Upvotes: 2

Franch86
Franch86

Reputation: 11

Usually when you want a grid to fit its container , the layout of the container must be the type "FitLayout".

With this layout, when you add a single widget to the container, the widget will try to fit the entire container.

Upvotes: 0

MrTux
MrTux

Reputation: 34032

getView().setForceFit(true); only force fits the columns. - All methods in the getView() object only apply to the View within the grid.

In what kind of panel are you putting the grid? - Not all panels allow auto sizing. Try putting the grid into the center of a BorderLayoutContainer (by using ´setCenterWidget(GRID)´

Upvotes: 1

Related Questions