View Full Version : XmlReader for repated items

25 Apr 2007, 6:47 AM

I am still in process of learning using Ext.Grid and have some questions for XmlReader.
We have a java web app which is currently using Rico live grid, but we get the request to display data in Ext.Grid or Rico grid depending on user settings.
Because we have all backend logic for Rico already, i am trying to accomodate Ext.Grid UI rendering for existing XML structure that we get for Rico. This is the structure we have now

<?xml version="1.0" encoding="UTF-8"?>
<response id="data_table_updater" type="object">
<bookmark>Listing records {0} - {1} of {2}</bookmark>
<bookmarknomatching>No matching records</bookmarknomatching>
<bookmarknorecords>No records</bookmarknorecords>
<waiting>Waiting for data...</waiting>
<timeout>Request for data timed out!</timeout>
<rows offset="0" update_ui="true">
<td>&lt;a href="action.html?op=edit&amp;id=506" class="editInstanceLink"&gt;&lt;img src="../images/edit.gif" alt="Edit"&gt;&lt;/a&gt;</td>
<td>&lt;a href="action.html?op=edit&amp;id=507" class="editInstanceLink"&gt;&lt;img src="../images/edit.gif" alt="Edit"&gt;&lt;/a&gt;</td>

And i haven't seen examples for parsing xml nodes that repeat inside one element. Here is JS code that i was trying to use, but i dont know XmlReader enough and how can i parse this XML with it.

* Ext - JS Library 1.0 Alpha 3 - Rev 4
* Copyright(c) 2006-2007, Jack Slocum.


// create the Data Store
var ds = new Ext.data.Store({
// load using HTTP
proxy: new Ext.data.HttpProxy({url: 'search.xml'}),

// the return will be XML, so lets set up a reader
reader: new Ext.data.XmlReader({
// records will have an "tr" tag
record: 'tr',
totalRecords: '@rowcount'
}, [
// set up the fields mapping into the xml doc
// The first needs mapping, the others are very basic
{name: 'userId', mapping: 'td'},
{name: 'firstName', mapping: 'td'}

var cm = new Ext.grid.ColumnModel([
{header: "UserID", width: 120, dataIndex: 'userId'},
{header: "UserName", width: 150, dataIndex: 'firstName'}
cm.defaultSortable = true;

// create the grid
var grid = new Ext.grid.Grid('example-grid', {
ds: ds,
cm: cm

var gridFoot = grid.getView().getFooterPanel(true);

// add a paging toolbar to the grid's footer
var paging = new Ext.PagingToolbar(gridFoot, ds, {
pageSize: 20,
displayInfo: true,
displayMsg: 'Displaying persons {0} - {1} of {2}',
emptyMsg: "No persons to display"


i dont know how can i access 2nd or 3rd <td>. I know display headers because i get it from the backend, but i can't parse it this way. All items would have value of first <td> node.
Also, since i already have this
<bookmark>Listing records {0} - {1} of {2}</bookmark>
in resulting XML, can i use it for Ext.PagingToolbar.displayMsg because it is already localized in XML.

Any help appreciated,

25 Apr 2007, 7:26 AM
'@rowcount' means it's an attribute just 'rowcount' will do.

'td:nth(1)' should get you the first td with the record which you correctly specified as being in a 'tr'

25 Apr 2007, 8:25 AM
And you can extract any other data you want out of the returned XML document. It's in your Reader as property "xmlData".

so where you keep a reference to your XmlReader in "myReader":

Ext.DomQuery.selectValue(myReader.xmlData, "bookmark")

Will get that string, and you can put that into Ext.PagingToolbar.prototype.displayMsg for a global change, or into paging.displayMsg for just that grid.

25 Apr 2007, 12:09 PM
Thanks a lot for your response!
That will be just what i needed! I have seen "nth" somewhere, but didnt realize i could use it in my case. Is there some documentation or example for this, so other people and myself could read more about it.

Thanks again,

25 Apr 2007, 11:36 PM
It needs a large swathe of documentation adding to the API docs.

I learnt it from this blog entry: http://www.jackslocum.com/blog/2007/01/11/domquery-css-selector-basic-xpath-implementation-with-benchmarks/

And from playing around withit on th Firebug console line, trying out selectors and examining what they produced.

18 May 2007, 2:16 PM
Is there a way to get the i th td tag in this case?
So rather than specifying a fixed mapping 'td:nth(1)' that gets the first td,
somehow specifying an index i that gets the ith td without recreating the entire mapping/reader?
Or alternately returns an Array with all tds for this particular tr?

I have data that has an unknown number of subitems in each record e.g.

<field>Brain Surgery</field>

Maybe for each record I could construct a new XmlReader that looks for td/item records within a single tr/record? Seems like overkill - there has to be a simpler way.

18 May 2007, 9:43 PM
I don't understand what you want. Is this in the context of an XmlReader for a Grid? Because if so, you'll always have a fixed mapping of a Field to an Element.

But on the principal, a DomQuery spec is just a String, and can be computed:

dq = "td:nth(" + index + ")";

21 May 2007, 11:24 AM
Yes I have an XmlReader and display records in a grid. But each record has a field that can have many entries -
an example is an email that has many to, cc, bcc etc recipients.
I want to be able to display all recipients - ideally be able to specify a mapping that
converts multiple instances of a field within a record to an Array.
In my example above I would like a field "item" that returns an Array.
I think in another thread you had suggested allowing a custom function in the mapping
which would be very flexible and could do the above. I will try using something like that.

Typically I wouldn't need to display the Array data in the main grid, but if a record is selected or hovered over,
I might show the full array in a detail panel, or maybe the new fat row mechanism in Grid that I saw a preview of.

3 Feb 2008, 10:34 PM
Did you eventually find a solution to your problem ("XmlReader and display records in a grid. But each record has a field that can have many entries")?

I am trying to solve the same problem, i'm not sure how to solve it.