PDA

View Full Version : XML Paging grid no "paginates"



fjulbe
16 Oct 2008, 4:04 AM
Hi everyone. I have some XML fomat text that I want to display into a XMLGrid with pagination. The problem is that although the grid is displayed, it displays always all records. They should be grouped by 50 out of 200, but everytime I click to show the next poage, it displays everything again.

Code:

...
setLayout(new FlowLayout(10));
List<ColumnConfig> configs = new ArrayList<ColumnConfig>();

/* Just to retrieve the field headers, my xml code has a quite complex structure,
that's why you would see something called "ownreader */

/*
xml is the text saved into a string
*/

ColumnConfig column;
String[] headers = getTableHeaders(xml);
CheckBoxSelectionModel sm = new CheckBoxSelectionModel();
sm.setSelectionMode(SelectionMode.MULTI);
configs.add(sm.getColumn());

for (int i = 0; i < headers.length; i++) {
column = new ColumnConfig();
column.setId(headers[i]);
column.setHeader(headers[i]);
column.setWidth(150);
column.setAlignment(HorizontalAlignment.CENTER);
configs.add(column);
}

/* This proxy is just a memoryproxy with few changes, not relevant, just for
debugging */
OwnProxy proxy = new OwnProxy(xml);

ModelType type = new ModelType();
type.root = "VOTABLE";
type.recordName = "TR";
type.addField("TD");

OwnReader reader = new OwnReader(type,headers) {
@Override
protected ListLoadResult newLoadResult(Object loadConfig, List models) {
PagingLoadConfig config = (PagingLoadConfig)loadConfig;
PagingLoadResult result = new BasePagingLoadResult(models);
result.setOffset(config.getOffset());
return result;
}
};
final BasePagingLoader loader = new BasePagingLoader(proxy, reader);
loader.setRemoteSort(true);
loader.load(0, 50);

ListStore store = new ListStore(loader);

final PagingToolBar toolBar = new PagingToolBar(50);
toolBar.bind(loader);

ColumnModel cm = new ColumnModel(configs);

Grid grid = new Grid(store, cm);
grid.setBorders(true);
grid.setAutoExpandColumn(headers[1]);
grid.setSelectionModel(sm);
grid.setLoadMask(true);

ContentPanel panel = new ContentPanel();
panel.setFrame(true);
panel.setCollapsible(true);
panel.setAnimCollapse(false);
panel.setButtonAlign(HorizontalAlignment.CENTER);
panel.setIconStyle("icon-table");
panel.setHeading("Paging Grid");
panel.setLayout(new FitLayout());
panel.add(grid);
panel.setSize(800, 380);
panel.setBottomComponent(toolBar);
add(panel);

.........

And just two more things:

1. I have to click on "refresh" button to display the grid results at the very beginning, if not, appears empty.
2. The "Loading..." is not shown when I click on next page. Maybe is it related to the fact that always displays all records?

Thanks!

fjulbe
16 Oct 2008, 10:34 AM
I tried to simlpify the problem so I have this piece of code:

public class MainEntryPoint extends LayoutContainer implements EntryPoint {

/** Creates a new instance of MainEntryPoint */
public MainEntryPoint() {

setLayout(new FlowLayout(10));

List<ColumnConfig> columns = new ArrayList<ColumnConfig>();
columns.add(new ColumnConfig("Sender", "Sender", 100));
columns.add(new ColumnConfig("Email", "Email", 165));
columns.add(new ColumnConfig("Phone", "Phone", 100));
columns.add(new ColumnConfig("State", "State", 50));
columns.add(new ColumnConfig("Zip", "Zip Code", 65));

// create the column model
ColumnModel cm = new ColumnModel(columns);

// defines the xml structure
ModelType type = new ModelType();
type.root = "records";
type.recordName = "record";
type.addField("Sender", "Name");
type.addField("Email");
type.addField("Phone");
type.addField("State");
type.addField("Zip");

// use a http proxy to get the data
RequestBuilder builder = new RequestBuilder(RequestBuilder.GET, "data.xml");
HttpProxy proxy = new HttpProxy(builder);

XmlReader reader = new XmlReader(type) {
@Override
protected ListLoadResult newLoadResult(Object loadConfig, List models) {
PagingLoadConfig config = (PagingLoadConfig)loadConfig;
PagingLoadResult result = new BasePagingLoadResult(models);
result.setOffset(config.getOffset());
return result;
}
};
final BasePagingLoader loader = new BasePagingLoader(proxy, reader);

loader.setRemoteSort(true);

ListStore store = new ListStore(loader);

final PagingToolBar toolBar = new PagingToolBar(50);
toolBar.bind(loader);



// need a loader, proxy, and reader
Grid grid = new Grid(store, cm);
grid.setBorders(true);
grid.setAutoExpandColumn("Sender");
grid.setLoadMask(true);
ContentPanel panel = new ContentPanel();
panel.setFrame(true);
panel.setCollapsible(true);
panel.setAnimCollapse(false);
panel.setButtonAlign(HorizontalAlignment.CENTER);
panel.setIconStyle("icon-table");
panel.setHeading("XML Table Demo");
panel.setLayout(new FitLayout());
panel.add(grid);
panel.setBottomComponent(toolBar);
panel.setSize(575, 350);

Button load = new Button("Load XML");
load.addSelectionListener(new SelectionListener<ComponentEvent>() {
public void componentSelected(ComponentEvent ce) {
loader.load(0,50);
}
});
panel.addButton(load);
add(panel);

}
public void onModuleLoad() {
RootPanel.get().add(this);
}

}

This code, creates a grid in the browser and clickng a button, loads some data to the grid. It is supposed to paginate by groups of 50 records. The tool bar says so, but the grid loads all records at every "page". I'm really lost. Am I missing something really simple somewhere?

Any help?

Thanks in advance.

jpnet
17 Oct 2008, 6:48 AM
What does your Xml look like? Does this example help at all? http://extjs.com/forum/showthread.php?t=47906&highlight=grid+xmlreader

fjulbe
20 Oct 2008, 3:40 AM
I'll take a look.

My xml is data.xml file that comes with gxt 1.1.1. So I just tried to copy the example shown in GXT explorer.

I'll let you know.

fjulbe
20 Oct 2008, 6:18 AM
What does your Xml look like? Does this example help at all? http://extjs.com/forum/showthread.php?t=47906&highlight=grid+xmlreader

I used that example and it happens exactly the same, it is not paginating. Every page shows all the records...

And secondly. Once some data has been loaded to the grid, I cannot see it until I click on some field to sort the records, then it is displayed, but although I know data is there, the grid is not refreshed once the data it is loaded...

jpnet
20 Oct 2008, 9:35 AM
So you used my example verbatim and my XML and you still got incorrect results????

-JP

fjulbe
20 Oct 2008, 10:31 PM
I changed your example to feed the table with a file, like this:

public void onModuleLoad() {
String url = "data.xml";

GridPanel gp = new GridPanel();
gp.setRequestUrl(url);

ColumnConfig columnConfigOutputUm = new ColumnConfig("output_um", "Output (uM)", 100);
ColumnConfig columnConfigInstallDate = new ColumnConfig("install_date", "Install Date", 75);

List<ColumnConfig> config = new ArrayList<ColumnConfig>();
config.add(columnConfigOutputUm);
config.add(columnConfigInstallDate);

ModelType mt = new ModelType();
mt.id = "id"; mt.root = "lamp_sessions"; mt.totalName = "total"; mt.recordName = "lamp_session";
mt.addField("output_um", "output_um");
mt.addField("install_date", "install_date");

final ColumnModel cm = new ColumnModel(config);
gp.setColumnModel(cm);
gp.setModelType(mt);
gp.setHeight(500);
gp.show();
gp.layout();

setLayout(new FitLayout());

add(gp);
layout();

gp.load();
}

data.xml file looks like this:
----------------
<lamp_sessions total="7">
<lamp_session>
<id>1</id>
<output_um>45.0</output_um>
<output_lux>4533.0</output_lux>
<output_amps>8.0</output_amps>
<usage_hours>75.0</usage_hours>
<last_checked_hours>0.0</last_checked_hours>
<install_date>2008-07-10 11:31:43 UTC</install_date>
</lamp_session>
<lamp_session>
<id>5</id>
<output_um>45.0</output_um>
<output_lux>4333.0</output_lux>
<output_amps>7.9</output_amps>
<usage_hours>33.22</usage_hours>
<last_checked_hours>0.0</last_checked_hours>
<install_date>2008-07-10 11:35:53 UTC</install_date>
</lamp_session>
<lamp_session>
<id>51</id>
<output_um>45.0</output_um>
<output_lux>4333.0</output_lux>
<output_amps>7.9</output_amps>
<usage_hours>33.22</usage_hours>
<last_checked_hours>0.0</last_checked_hours>
<install_date>2008-07-10 11:35:53 UTC</install_date>
</lamp_session>
<lamp_session>
<id>53</id>
<output_um>45.0</output_um>
<output_lux>4333.0</output_lux>
<output_amps>7.9</output_amps>
<usage_hours>33.22</usage_hours>
<last_checked_hours>0.0</last_checked_hours>
<install_date>2008-07-10 11:35:53 UTC</install_date>
</lamp_session>
<lamp_session>
<id>55</id>
<output_um>45.0</output_um>
<output_lux>4333.0</output_lux>
<output_amps>7.9</output_amps>
<usage_hours>33.22</usage_hours>
<last_checked_hours>0.0</last_checked_hours>
<install_date>2008-07-10 11:35:53 UTC</install_date>
</lamp_session>
<lamp_session>
<id>59</id>
<output_um>45.0</output_um>
<output_lux>4333.0</output_lux>
<output_amps>7.9</output_amps>
<usage_hours>33.22</usage_hours>
<last_checked_hours>0.0</last_checked_hours>
<install_date>2008-07-10 11:35:53 UTC</install_date>
</lamp_session>
<lamp_session>
<id>35</id>
<output_um>45.0</output_um>
<output_lux>4333.0</output_lux>
<output_amps>7.9</output_amps>
<usage_hours>33.22</usage_hours>
<last_checked_hours>0.0</last_checked_hours>
<install_date>2008-07-10 11:35:53 UTC</install_date>
</lamp_session>
<lamp_session>
<id>15</id>
<output_um>45.0</output_um>
<output_lux>4333.0</output_lux>
<output_amps>7.9</output_amps>
<usage_hours>33.22</usage_hours>
<last_checked_hours>0.0</last_checked_hours>
<install_date>2008-07-10 11:35:53 UTC</install_date>
</lamp_session>
<lamp_session>
<id>95</id>
<output_um>45.0</output_um>
<output_lux>4333.0</output_lux>
<output_amps>7.9</output_amps>
<usage_hours>33.22</usage_hours>
<last_checked_hours>0.0</last_checked_hours>
<install_date>2008-07-10 11:35:53 UTC</install_date>
</lamp_session>
</lamp_sessions>
----------------

And finally I set the page size to 3 records.
(In GridPanel.java):
...
m_pageSize = 3; m_offset = 0; m_requestUrl = ""; m_isVisible = false;
...

And yet, when I run this, I see all records in data.xml.

fjulbe
21 Oct 2008, 10:50 PM
I could make it work, bu I wrote more code than I tought I should.

jpnet
22 Oct 2008, 7:32 AM
The reason it doesn't work, or at least why it appears that all of the data is showing up is because you are putting all of your data in the xml file. The paging toolbar just helps increment the URL parameters so you don't have to worry about it, the server then outputs the new xml everytime it receives the new URL parameters. The only thing that stays constant in the xml is the total property. That should always be the total of the entire dataset, not just the data in the xml.

I hope that clears up any confusion.

-JP

fjulbe
22 Oct 2008, 11:15 PM
Interesting.
So, if I have all my data already in memory, the pagination does not work?

jpnet
23 Oct 2008, 6:39 AM
No, that's not true either. I *think* but am not positive, but MemoryProxy may help you in this case. I would be interested to know what you find out.

-JP

fjulbe
24 Oct 2008, 5:52 AM
I solved the issue temporarly. I can paginate and sort, but I implemented a lot of code. I used a memory proxy loading a list of records from an XML previously parsed by some code I wrote. The thing is that when the proxy calls for "read()", I had to insert some logic in between the proxy and the reader to paginate and sort. I'm not sure if it the "correct" way, but it works very smooth and light.