GWT Data grid does not show data - gwt

Question

i have been trying to implement datagrid in my project , the problem is that the data grid does not show data , the data is there but is not visible , i tried to inspect the html page and with adding some height and width to the inner divs inside the datagrid parent div the data is displayed perfectly , i can do this using css and its done , but if there is another solution or in other words anyone knows whats wrong with datagrid?
public class DataGridTest implements EntryPoint, ClickHandler {
private ListDataProvider<TestObject> listProvider;
public void onModuleLoad() {
List<TestObject> list = new ArrayList<TestObject>();
list.add(new TestObject("Amer",22));
list.add(new TestObject("Essa",25));
list.add(new TestObject("Asem",29));
DataGrid<TestObject> dataGrid = new DataGrid<TestObject>();
dataGrid.setStyleName("dataGridTest");
TextColumn<TestObject> nameColumn = new TextColumn<TestObject>(){
#Override
public String getValue(TestObject object) {
return object.getName();
}
};
dataGrid.addColumn(nameColumn,"Name");
TextColumn<TestObject> ageColumn = new TextColumn<TestObject>(){
#Override
public String getValue(TestObject object) {
return object.getAge()+"";
}
};
dataGrid.addColumn(ageColumn,"Age");
listProvider = new ListDataProvider<TestObject>();
listProvider.addDataDisplay(dataGrid);
listProvider.setList(list);
LayoutPanel layoutPanel = new LayoutPanel();
layoutPanel.add(dataGrid);
RootPanel.get().add(layoutPanel);
layoutPanel.forceLayout();
Button btn = new Button("lala");
btn.getElement().getStyle().setPosition(Position.ABSOLUTE);
RootPanel.get().add(btn);
btn.addClickHandler(this);
}
public class TestObject {
private String name;
private int age;
public TestObject(String name, int age) {
this.name = name;
this.age = age;
}
public String getName() {
return this.name;
}
public int getAge() {
return this.age;
}
}
#Override
public void onClick(ClickEvent event) {
listProvider.getList().add(new TestObject("lala", 10));
}
}

Answer 1

You are mixing RootPanel and LayoutPanel, which doesn't work.
You must use RootLayoutPanel instead.
The DataGrid has to be put in a LayoutPanel and there must an unbroken chain up to the RootLayoutPanel.
Alternatively you have to specify explicit dimensions (height, width) on the parent container of your DataGrid or use a CellTable instead.
RootLayoutPanel.get().add(layoutPanel) should fix your issue.