[2.2.0 RC] Grid with CheckBoxSelectionModel doesn't paint the table

[maqjav]

Hello.

I updated my project to the last version and today I realized that my grid is not showing any elements on it.
If I use the inspector on Chrome I can find the content in the code, but the grid only shows the header, the body white. It doesn't paint even the scroll or the empty rows, just the header and a huge white space.

It was working on 2.2.0 beta.

Thanks.

[sven]

Please post a fully working testcase that implements EntryPoint. You will see that all examples work without any updates widht GXT 2.2 rc1

[maqjav]

Hello Sven.

Here is my code.
I think the problem comes from using a layout with AccordionLayout.

// Main layout
LayoutContainer filtrosPanel = new LayoutContainer(new AccordionLayout());
filtrosPanel.setSize(100, 500);
filtrosPanel.setBorders(true);
filtrosPanel.setScrollMode(Scroll.AUTOY);
filtrosPanel.setId("acordeonFiltros");

// Inside layout
ContentPanel filtroPanel = new ContentPanel(new RowLayout());
filtroPanel.setAnimCollapse(false);
filtroPanel.setSize(100, 500);
filtroPanel.setHeading("Proof container");

// Load datas
List<VFiltro> filtro = filtros.get(i); 
			
BeanModelFactory filtroFactory = BeanModelLookup.get().getFactory(VFiltro.class);
List<BeanModel> filtroModel = filtroFactory.createModel(filtro);
			
final ListStore<BeanModel> storeFiltro = new ListStore<BeanModel>();  
storeFiltro.add(filtroModel);

// CheckBoxes plugin
CheckBoxSelectionModel<BeanModel> sm = new CheckBoxSelectionModel<BeanModel>(); 

List<ColumnConfig> configs = new ArrayList<ColumnConfig>(); 
configs.add(sm.getColumn());  

ColumnConfig column = new ColumnConfig();  
column.setSortable(false);
column.setMenuDisabled(true);
column.setId("descripcion");  
column.setHeader("Descripción");  
column.setWidth(240);  
configs.add(column);  

ColumnModel cm = new ColumnModel(configs);

// Grid + plugin
Grid<BeanModel> grid = new Grid<BeanModel>(storeFiltro, cm); 
grid.setColumnReordering(true);  
grid.getAriaSupport().setLabelledBy(filtroPanel.getHeader().getId() + "-label");  
grid.addPlugin(sm); 
		    
filtroPanel.add(grid, new RowData(1,1)); 
filtrosPanel.add(filtroPanel);

As you can see it's the same code than in your example, but with the diference of the AccordionLayout.

Thank you again.

[sven]

Can you please post some fully working testcase that implements EntryPoint for this?

[sven]

I did a testcase with an AccordionLayout but itstill renders fine.

[maqjav]

Hello Sven.

I've been making some tests and I've been always getting the same rendering problem.
It seems something has changed from the last version and now my grid is not taking the correct height, look the next code:

<div class="x-grid3" role="presentation" styles="width: 260px; height 21px;">
  <div class="x-grid3-viewport" role="presentation">
     <div class="x-grid3-header" role="presentation">_</div>
     <div class="x-grid3-scroller" role="presentation" styles="width: 260px; height: 0px;">     <--- HEIGHT: 0px;
         <div class="x-grid3-body" role="presentation">
           --- rows ---

In 2.2.0 beta I had the next code and it was rendering the height perfectly.

Grid<BeanModel> grid = new Grid<BeanModel>(storeFiltro, cm); 
grid.getView().setAutoFill(true);
grid.setSelectionModel(sm);
grid.addPlugin(sm);

Now I have to set the height in order to render it.

Grid<BeanModel> grid = new Grid<BeanModel>(storeFiltro, cm);
grid.setSelectionModel(sm);
grid.addPlugin(sm); 
grid.setHeight(panelHeight);

So I guess "grid.getView().setAutoFill(true);" is not working correctly in this last version, isn't it?.


Thanks for your help.

[sven]

AutoFIll is not setting any height. You should always size your grid. Can you please post a fully working testcase for your issue? According to your codesnippets you are sizing your grid. Probably there is an issue in your layoutchain.

[maqjav]

AutoFIll is not setting any height. You should always size your grid. Can you please post a fully working testcase for your issue? According to your codesnippets you are sizing your grid. Probably there is an issue in your layoutchain.

Here is a testcase:

import java.util.ArrayList;
import java.util.List;

import com.extjs.gxt.samples.resources.client.TestData;  
import com.extjs.gxt.samples.resources.client.model.Stock;  
import com.extjs.gxt.ui.client.Style.Scroll;
import com.extjs.gxt.ui.client.data.BeanModel;
import com.extjs.gxt.ui.client.store.ListStore;
import com.extjs.gxt.ui.client.widget.ContentPanel;
import com.extjs.gxt.ui.client.widget.LayoutContainer;
import com.extjs.gxt.ui.client.widget.grid.CheckBoxSelectionModel;
import com.extjs.gxt.ui.client.widget.grid.ColumnConfig;
import com.extjs.gxt.ui.client.widget.grid.ColumnModel;
import com.extjs.gxt.ui.client.widget.grid.Grid;
import com.extjs.gxt.ui.client.widget.layout.AbsoluteLayout;
import com.extjs.gxt.ui.client.widget.layout.AccordionLayout;
import com.extjs.gxt.ui.client.widget.layout.RowData;
import com.extjs.gxt.ui.client.widget.layout.RowLayout;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.PopupPanel;
import com.google.gwt.user.client.ui.RootPanel;

public class Test implements EntryPoint {
	
	public void onModuleLoad() {
		
		final PopupPanel popUp = new PopupPanel(true);
		
		ContentPanel popUpContent = new ContentPanel(new AbsoluteLayout());
		popUpContent.setHeaderVisible(false);
		popUpContent.setSize(400, 600);
		
		// Accordion
		LayoutContainer filtrosPanel = new LayoutContainer(new AccordionLayout());
		filtrosPanel.setSize(300, 600);
		filtrosPanel.setBorders(true);
		filtrosPanel.setScrollMode(Scroll.AUTOY);
		filtrosPanel.setId("acordeonFiltros");
		
		// First panel
		ContentPanel filtroPanel = new ContentPanel(new RowLayout());
		filtroPanel.setAnimCollapse(false);
		filtroPanel.setSize(300, 600);
		filtroPanel.setHeading("Testing grid");
		
		List<Stock> stocks = TestData.getStocks(); 
		
		List<ColumnConfig> configs = new ArrayList<ColumnConfig>();  
		  
	    final CheckBoxSelectionModel<Stock> sm = new CheckBoxSelectionModel<Stock>();  
	    
	    configs.add(sm.getColumn());  
	    
	    ColumnConfig column = new ColumnConfig();  
	    column.setId("name");  
	    column.setHeader("Company");  
	    column.setWidth(240);  
	    configs.add(column);  
	    
	    ListStore<Stock> store = new ListStore<Stock>();  
	    store.add(stocks); 
	    
	    ColumnModel cm = new ColumnModel(configs); 
	    
	    Grid<Stock> grid = new Grid<Stock>(store, cm);
	    grid.setSelectionModel(sm);
	    grid.addPlugin(sm); 
	    grid.getView().setAutoFill(true);

	    filtroPanel.add(grid, new RowData(1,1)); 
		filtrosPanel.add(filtroPanel);
		
		popUpContent.add(filtrosPanel);
		popUp.add(popUpContent);
		
		popUp.show();
	}
}

[sven]

That testcase renders fine for me against 2.2 RC1

[maqjav]

Well then I don't know what's going on... in my project the same code but with different datas doesn't render if I doesn't use setHeight.
Anyway, at least giving a height it works .

I am using Chrome and I made tests with Firefox too, I don't think is a navigator problem, but just in case I suggest it.

If I find out something new I will make you know.

Thanks sven.