Existing Table to Grid Example Extension

[rivas_dev]

Hi all...

I am new to ExtJS; I am using the example noted on the title to this post. I was able to get it to work, but I am now trying to specify the Record ids that I want to use. In the code, we have:


var fields = [], cols = [];
var headers = table.query("thead th");
for (var i = 0, h; h = headers[i]; i++) {
var text = h.innerHTML;
var name = 'tcol-'+i;

fields.push(Ext.applyIf(cf[i] || {}, {
name: name,
mapping: 'td:nth('+(i+1)+')/@innerHTML'
}));

cols.push(Ext.applyIf(ch[i] || {}, {
'header': text,
'dataIndex': name,
'width': h.offsetWidth,
'tooltip': h.title,
'sortable': true
}));
}

var ds = new Ext.data.Store({
reader: new Ext.data.XmlReader({
record:'tbody tr'
}, fields)
});


Lets say my html is:


<table cellspacing="5" id="the-table">
<thead>
<tr style="background:#eeeeee;">
<th>Id</th>
<th>First Name</th>
<th>Last Name</th>
</tr>
</thead>
<tbody>
<tr>
<td>0123</td>
<td>John</td>
<td>Doe</td>
</tr>
<tr>
<td>1234</td>
<td>John</td>
<td>Smith</td>
</tr>
</tbody>
</table>


What can I do to specify in the Store to use the id on the table as the Record id?

[rivas_dev]

I was able to find the answer; one needs to set the id as follows:


ds = new Ext.data.Store({
reader: new Ext.data.XmlReader({
record:'tbody tr',
id: 'td:nth(1)/@innerHTML'
}, fields)
});


Where 'td:nth(1)' maps to the column that should be used as the rowId.

:)