Need help on Grid with XML Reader [Archive]

marimuthup

4 Oct 2007, 9:11 AM

Hi,

I am trying to create a simple grid with XML reader.

The data is not rendered in the grid.

I tried the examples, even the examples didn't work locally.

Here is my code

var empGrid = {
init: function(){
var myPageSize = 10;

var fm = Ext.form, Ed = Ext.grid.GridEditor;

var cm = new Ext.grid.ColumnModel([{
id: 'id',
header: "id",
dataIndex: 'id',
width: 150,
hidden: true
},
{
header: "First Name",
dataIndex: 'firstname',
width: 230
},
{
header: "Last Name",
dataIndex: 'lastname',
width: 230
}
]);

var RecordDef = Ext.data.Record.create([
{name:'id', mapping:'id'},
{name:'firstname', mapping:'firstname'},
{name:'lastname', mapping:'lastname'}
]);

var ds = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url: 'sample.xml'}),
reader: new Ext.data.XmlReader({record: 'account', id: 'id', totalRecords: 'totalcount'}, RecordDef)
});

// create the editor grid
var grid = new Ext.grid.Grid('editor-grid', {
ds: ds,
cm: cm
});

var layout = Ext.BorderLayout.create({
center: {
margins:{left:2,top:3,right:2,bottom:3},
panels: [new Ext.GridPanel(grid)]
}
}, 'grid-panel');

grid.render();
ds.load();

}
}
Ext.EventManager.onDocumentReady(empGrid.init, empGrid, true);

Here is my XML

<dataset>
<totalcount>2</totalcount>
<account>
<id>
1
</id>
<firstname>
mari
</firstname>
<lastname>
muthu
</lastname>
</account>
<account>
<id>
2
</id>
<firstname>
muthu
</firstname>
<lastname>
mari
</lastname>
</account>
</dataset>

Here is my HTML

<html>
<head>

<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />


<script type="text/javascript" src="ext/adapter/yui/yui-utilities.js"></script>
<script type="text/javascript" src="ext/adapter/yui/ext-yui-adapter.js"></script>


<script type="text/javascript" src="ext/ext-all.js"></script>


<script type="text/javascript" src="gridaction.js"></script>


<link rel="stylesheet" type="text/css" href="ext/examples/examples.css" />
</head>
<body>
<div class="content">


<div id="grid-panel" style="width:100%;height:290px;" >
<div id="editor-grid"></div>
</div>



</div>
</body>
</html>

Thanks in advance.