PDA

View Full Version : How manually load XML to Ext.Data.Store?



vtulin
10 Apr 2010, 10:56 AM
I'm using extjs localy on my computer, so I'm not able to use ajax, urls etc. So I'm loading XML via Msxml2.DOMDocument, but I didn't find how to load this parsed XML data to Store. Please help.

talha06
10 Apr 2010, 12:48 PM
Hi dear friend,

I strongly recommend you to look here (http://www.extjs.com/deploy/dev/docs/?class=Ext.data.XmlStore). Basically all you need to do is sending data from server in XML format and passing the servlet's or any other server-side applications' URL to Ext's XMLStore object.

Hope this helps you.
Talha

vtulin
10 Apr 2010, 12:50 PM
Basically all you need to do is sending data from server in XML format and passing the servlet's or any other server-side applications' URL to Ext's XMLStore object.

I'm using it locally, I'm not using server.

asp3ctus
10 Apr 2010, 1:01 PM
Have you looked in examples ?

http://www.extjs.com/deploy/dev/examples/grid/xml-grid.html
http://www.extjs.com/deploy/dev/examples/tree/xml-tree-loader.html
http://www.extjs.com/deploy/dev/examples/form/xml-form.html

All of them have XML you can see it being used in different ways .... you should have no problems with it

vtulin
10 Apr 2010, 10:16 PM
Have you looked in examples ?

http://www.extjs.com/deploy/dev/examples/grid/xml-grid.html
http://www.extjs.com/deploy/dev/examples/tree/xml-tree-loader.html
http://www.extjs.com/deploy/dev/examples/form/xml-form.html

All of them have XML you can see it being used in different ways .... you should have no problems with it
First of all this examples are for XML FILES LOCATED IN WEB, and I need to operate with LOCALLY LOCATED FILES ON MY LOCAL COMPUTER. In case of locally located xml files, you can't use ajax, or any web procedure, you can use Msxml2.DOMDocument or ActiveX FileSystemObject to load data from file, as a result in first case you have parsed XML object in second - String.
My question can have a different view: How can I manually load this variable var a = "<records><record>A</record><record>B</record></records>" to EXTJS Grid?

evant
10 Apr 2010, 10:29 PM
1) Create an XML document object: http://stackoverflow.com/questions/649614/xml-parsing-in-javascript
2) Call loadRecords on the store, passing in the object.

vtulin
10 Apr 2010, 11:15 PM
2) Call loadRecords on the store, passing in the object.
Could you please write an example? I've already tried this method, but it didn't help, maybe I was doing something wrong.

vtulin
11 Apr 2010, 1:14 AM
Here please check what am I trying to do. Records are readed well, it shows 3 read records, but after that I think I'm doing something wrong...


Ext.onReady(function() {
var Xml = new ActiveXObject("Msxml2.DOMDocument.4.0");
Xml.async = false;
Xml.loadXML("\
<Items>\
<Item>\
<ASIN>0446355453</ASIN>\
<Author>Sidney Sheldon</Author>\
<Manufacturer>Warner Books</Manufacturer>\
<ProductGroup>Book</ProductGroup>\
<Title>Master of the Game</Title>\
</Item>\
<Item>\
<ASIN>0446613657</ASIN>\
<Author>Sidney Sheldon</Author>\
<Manufacturer>Warner Books</Manufacturer>\
<ProductGroup>Book</ProductGroup>\
<Title>Are You Afraid of the Dark?</Title>\
</Item>\
<Item>\
<ASIN>0446357421</ASIN>\
<Author>Sidney Sheldon</Author>\
<Manufacturer>Warner Books</Manufacturer>\
<ProductGroup>Book</ProductGroup>\
<Title>If Tomorrow Comes</Title>\
</Item>\
</Items>");

var xmlReader = new Ext.data.XmlReader(
{ record: 'Item', id: 'ASIN' },
['Author', 'Title', 'Manufacturer', 'ProductGroup']);

var myRecords = xmlReader.readRecords(Xml);
alert(myRecords.records.length);

var store = new Ext.data.XmlStore({
autoLoad: true,
proxy: new Ext.data.MemoryProxy(myRecords),
record: 'Item',
idPath: 'ASIN',
fields: [ 'Author', 'Title', 'Manufacturer', 'ProductGroup']
});
var grid = new Ext.grid.GridPanel({
store:store,
columns: [
{ header: "Author", width: 120, dataIndex: 'Author', sortable: true },
{ header: "Title", width: 180, dataIndex: 'Title', sortable: true },
{ header: "Manufacturer", width: 115, dataIndex: 'Manufacturer', sortable: true },
{ header: "Product Group", width: 100, dataIndex: 'ProductGroup', sortable: true }
],
renderTo: 'example-grid',
width: 540,
height: 200
});
});

vtulin
11 Apr 2010, 3:31 AM
I was investigating the source code for MemoryProxy and found that it calls ReadRecords by itself, so the code is much more simplier, and it works for me:

Ext.onReady(function() {
var Xml = new ActiveXObject("Msxml2.DOMDocument.4.0");
Xml.async = false;
Xml.loadXML("\
<Items>\
<Item>\
<ASIN>0446355453</ASIN>\
<Author>Sidney Sheldon</Author>\
<Manufacturer>Warner Books</Manufacturer>\
<ProductGroup>Book</ProductGroup>\
<Title>Master of the Game</Title>\
</Item>\
<Item>\
<ASIN>0446613657</ASIN>\
<Author>Sidney Sheldon</Author>\
<Manufacturer>Warner Books</Manufacturer>\
<ProductGroup>Book</ProductGroup>\
<Title>Are You Afraid of the Dark?</Title>\
</Item>\
<Item>\
<ASIN>0446357421</ASIN>\
<Author>Sidney Sheldon</Author>\
<Manufacturer>Warner Books</Manufacturer>\
<ProductGroup>Book</ProductGroup>\
<Title>If Tomorrow Comes</Title>\
</Item>\
</Items>");

var store = new Ext.data.XmlStore({
proxy: new Ext.data.MemoryProxy(Xml),
record: 'Item',
idPath: 'ASIN',
fields: ['ASIN', 'Author', 'Title', 'Manufacturer', 'ProductGroup']
});
var grid = new Ext.grid.GridPanel({
store: store,
columns: [
{ header: "Author", width: 120, dataIndex: 'Author', sortable: true },
{ header: "Title", width: 180, dataIndex: 'Title', sortable: true },
{ header: "Manufacturer", width: 115, dataIndex: 'Manufacturer', sortable: true },
{ header: "Product Group", width: 100, dataIndex: 'ProductGroup', sortable: true }
],
renderTo: 'example-grid',
width: 540,
height: 200
});
store.load();
});

P.S. Do not use autoLoad, use store.load() at the end instead...
Thanks to all! :)

billtricarico
14 Dec 2010, 11:00 AM
Hello,

I am doing something similar where I am loading the XML from third party proxy as a string, then converting to XML. That party works. However, when I create the XML object and pass it into the MemoryProxy, I get an exception: "Cannot read property 'prototype' of undefined". I have trace this to ext-3.3.1/ext-all-debug line 24522: "var f = this.recordType.prototype.fields;"

Here is my code:


var ds = new Ext.data.XmlStore({
storeId: 'DataFeed',
record: 'item',
field: [
{
name: 'title',
mapping: 'title'
},
{
name: 'description',
mapping: 'description'
},
{
name: 'Link',
mapping: 'Link'
}
]
});

...

var req = new WIDGETBOX.net.ProxiedHTTPRequest();
req.onload = function()
{
//alert(req.responseText);
var xmlStr = req.responseText;

// parse string into XML
var xml = null;
if (typeof DOMParser != "undefined")
{
// Mozilla, Firefox, and related browsers
xml = (new DOMParser()).parseFromString(xmlStr, "application/xml");
}
else if (typeof ActiveXObject != "undefined")
{
// Internet Explorer.
var doc = XML.newDocument();
doc.loadXML(xmlStr);
xml = doc;
}

ds.proxy = new Ext.data.MemoryProxy(xml);
ds.proxy.on('load',function (dataProxy, o, options) { alert("proxy.load"); });
ds.proxy.on('exception',function(dataProxy,type,action,options,response,arg)
{
alert("proxy.exception");
alert("arg = " + arg);
});

ds.on('load',function(store,records,options) { alert(store.storeId + ", " + records.length + " records"); });
ds.on('exception',function(misc) { alert("Exception: " + misc); });
ds.load();
}
req.open("get", "http://...");
req.send();


Thanks in advance for any help you can provide.

Stan C
21 Jun 2011, 1:39 PM
This code no longer works in v4. Here is the line that's raising an error (says not supported):

proxy: new Ext.data.MemoryProxy(Xml)

Any ideas?

Stan C
21 Jun 2011, 1:47 PM
The exact error is:

Message: Object doesn't support this action
Line: 25874
Char: 13
Code: 0
URI: http://localhost/extjs/ext-all-debug.js

ferengidedalo
12 Apr 2012, 5:43 AM
any solution for v4?