Hi Isomorphic,
I try to create a specific user interface, but I'm being lost with the scrollbar of the listgrid.
When the UI is loaded only the listgrid is displayed, when double clicking on a record this one will be opened in a tab.
As the listgrid is not yet in a tab, I create a tabset, I attach the listgrid as first tab and the record as second tab.
When closing the last tab of the record, the tabset is removed and the listgrid is attached to the layout.
Here is a standalone code
Code:
final VLayout vLayout = new VLayout();
vLayout.setMembersMargin(15);
vLayout.setHeight(400);
vLayout.setWidth(600);
final ListGrid supplyItemGrid = new ListGrid();
supplyItemGrid.setID("supplyList");
supplyItemGrid.setAutoFetchData(true);
ListGridRecord[] record = new ListGridRecord[100];
for(int i = 0;i<100;i++){
record[i] = new ListGridRecord();
record[i].setAttribute("LOGIN", "name"+i);
record[i].setAttribute("ID", i);
}
supplyItemGrid.setData(record);
ListGridField nameField = new ListGridField("LOGIN", 150);
ListGridField idField = new ListGridField("ID", 100);
supplyItemGrid.setFields(nameField, idField);
supplyItemGrid.setSelectionType(SelectionStyle.SINGLE);
supplyItemGrid.addCellDoubleClickHandler(new CellDoubleClickHandler() {
@Override
public void onCellDoubleClick(CellDoubleClickEvent event) {
if(tabSet == null){
tabSet = new TabSet();
Tab gridTab = new Tab("Grid");
vLayout.removeMember(supplyItemGrid);
supplyItemGrid.deparent();
gridTab.setPane(supplyItemGrid);
tabSet.addTab(gridTab);
vLayout.addMember(tabSet);
}
Tab tab = new Tab(event.getRecord().getAttribute("LOGIN"));
tab.setCanClose(true);
tabSet.addTab(tab);
tabSet.addCloseClickHandler(new CloseClickHandler() {
@Override
public void onCloseClick(TabCloseClickEvent event) {
if(tabSet != null && tabSet.getTabs().length == 2){
tabSet.selectTab(tabSet.getTabs()[0]);
supplyItemGrid.deparent();
tabSet.deparent();
vLayout.removeMember(tabSet);
vLayout.addMember(supplyItemGrid);
tabSet = null;
}
}
});
HLayout hLayout = new HLayout();
hLayout.setWidth100();
hLayout.setHeight100();
hLayout.addMember(new Label(event.getRecord().getAttribute("LOGIN")));
tab.setPane(hLayout);
tabSet.selectTab(tab);
}
});
vLayout.addMember(supplyItemGrid);
vLayout.draw();
Example 1 :
When selecting a record without doing any scrolling, the listgrid and the record are displayed on two tabs.
When going back to the tab with the listgrid the record on the grid is shown and selected.
When closing the record tab, the tabset is destroyed and the listgrid is displayed in mainlayout with the record selected and shown.
Example 2 : (Start from the listgrid in mainlayout)
Same example as the first one, but first scroll to the middle of the grid and select the record with name50, the listgrid and the record are displayed on two tabs.
When going back to the tab with the listgrid, you can see that the record name50 is not displayed in the grid (scroll is on top) but if you scroll down to the middle of the grid you can see that the record is selected.
Same thing if you close the tab of the record...
Can you explain me, if is it a way to force the display of the grid showing the selected record? And how to do it?
Regards
Julien