PDA

View Full Version : Help with XML datagrid rendering...



rishabhsagar
26 Nov 2007, 5:26 AM
My All,

My HTML file:




<html>
<head>
<title>paged datagrid</title>
<link rel="stylesheet" type="text/css" href="D:\ext-2.0-rc1\resources\css\ext-all.css" />

<!-- LIBS -->
<script type="text/javascript" src="D:\ext-2.0-rc1\adapter\ext\ext-base.js"></script>
<script type="text/javascript" src="D:\ext-2.0-rc1\ext-all.js"></script>
<script type="text/javascript" src = "newtest.js"></script>
<!-- ENDLIBS -->


<style type="text/css">
html, body {
font:normal 12px verdana;
margin:0;
padding:0;
border:0 none;
overflow:hidden;
height:100%;
}

</style>

</head>

<body>

<div id = "datagrid">
<!-- here is where the datagrid shoul be populated -->
</div>


<div id = "options">
<!-- here is where the options will be populated -->
</div>


</body>
</html>



My js File




/*
* Ext JS Library 2.0 RC 1
* Copyright(c) 2006-2007, Ext JS, LLC.
* [email protected]
*
* http://extjs.com/license
*/

Ext.onReady(function(){

// create the Data Store
var store = new Ext.data.Store({
// load using HTTP
url: 'http://localhost/paged%20db%20grid/getcustomer.asp',

// the return will be XML, so lets set up a reader
reader: new Ext.data.XmlReader({
// records will have an "Item" tag
record: 'Contact',
id: 'value'
}, [
// set up the fields mapping into the xml doc
// The first needs mapping, the others are very basic
{name: 'name'},
{name: 'value'},
{name: 'customerid'}
])
});

// create the grid
var grid = new Ext.grid.GridPanel({
store: store,
columns: [
{header: "Name", width: 120, dataIndex: 'name', sortable: true},
{header: "Value", width: 180, dataIndex: 'value', sortable: true},
{header: "CustomerID", width: 115, dataIndex: 'customerid', sortable: true}
],
renderTo:'datagrid',
width:540,
height:200
});

store.load();
});


The XML File format...




<?xml version="1.0" ?>
- <Customers>
- <Contact>
- <field name="name">
<value>Alfreds Futterkiste</value>
</field>
- <field name="value">
<value>val1</value>
</field>
- <field name="customerid">
<value>ALFKI</value>
</field>
</Contact>
+ <Contact> //***Only one node expaned for simplycity...***
+<Contact>
...
</Customers>



But when I try to open the page.. only the value column is getting populated...??:-/

I am still new to grids, and spent many hours on this trying to understand the grid component.. It would be gr8, if someone can point me to a tutorial where simple xml based grids are populated ['because I find it difficult to understand the XML given in the example directory]

Kindly point out where am I going wrong....:s

Many thanks for ur time and support!

rishabhsagar
27 Nov 2007, 12:56 AM
Anyone??? kindly help!

rishabhsagar
27 Nov 2007, 4:10 AM
Is anymore data needed for this query? Kindly help..

karl007
28 Nov 2007, 9:51 AM
Have you tried something like this:



<?xml version="1.0" ?>
<Customers>
<Contact>
<name>Alfreds Futterkiste</name>
<value>val1</value>
<customerid>ALFKI</customerid>
</Contact>
...
</Customers>