problem with data.Store and JSON data - Ext JS

最新推荐文章于 2023-10-08 17:18:53 发布

最新推荐文章于 2023-10-08 17:18:53 发布 · 184 阅读

文章标签：

#EXT #json #YUI #Firebug #PHP

extJs 专栏收录该内容

281 篇文章

订阅专栏

I've been looking up the forums and trying for a few days but still can't get my JSON data to "go inside" data store. :cry:

Here's the code:

function populate(myData)
{
	var _PAGESIZE = 10;
	
	var Expense = Ext.data.Record.create([
		{name: 'id', mapping: 'id'},
	        {name: 'category', mapping: 'category'},
	        {name: 'description', mapping: 'description'}
	    ]
	  
	);

       var reader = new Ext.data.JsonReader(
    									{	root: 'data',
        									totalProperty: 'recordcount',
        									id: 'id'
        								}, 
        								Expense);
	
	var ds = new Ext.data.Store({
		        proxy: new Ext.data.MemoryProxy(myData),
		        reader: reader,
		        remoteSort: true
			        });
	
   
        ds.setDefaultSort('category', 'desc');

	
       var cm = new Ext.grid.ColumnModel([
       {
           header: "Category",
           dataIndex: 'category',
           width: 100
        },{
           header: "Description",
           dataIndex: 'description',
           width: 200
        }
        ]);

    cm.defaultSortable = true;
	
    var grid = new Ext.grid.Grid('myGrid', {
        ds: ds,
        cm: cm,
        selModel: new Ext.grid.RowSelectionModel({singleSelect:true}),
        enableColLock:false
    });

    grid.render();

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

    var paging = new Ext.PagingToolbar(gridFoot, ds, {
        pageSize: _PAGESIZE,
        displayInfo: true,
        displayMsg: 'Displaying items {0} - {1} of {2}',
        emptyMsg: "No items to display"
    });
	
	ds.load({params:{start:0, limit:_PAGESIZE}});
		
}

Here's the Firebug output of myData, which is of the type "string":

{"recordcount":3,"data":[{"category":"Computer Hardware","description":"whatever","id":"08206FAE-9610-0322-40E109F1CA47E6A5"},{"category":"Legal Fee","description":"ok","id":"08266405-B3EC-A27A-4DB17D714CA5E2B3"},{"category":"Petrol","description":"petrol","id":"0827BE9A-F9F5-D19E-04B52C69BCD10B33"}]}

When I output my ds in firebug, the data is an empty array.

I used to have the grid working using 0.33 (XMLData). But I really want to try out the paging and JSON. I'm most preplexed as to why it's not working.

Please someone solve the mystery for me. Thanking you in advance.

03-11-2007, 03:41 AM

The only things I can see wrong with your code are:

remoteSort:true - but your data is local and you are using a MemoryProxy.

ds.setDefaultSort('category', 'desc'); - this is for remote sorting. for local data, just call sort.

- Paging doesn't work with local data. You need a server to do data paging.

Let me know if any of these correct your issue.

03-11-2007, 05:52 AM

Thanks, Jack.

I commented out the lines and still yield no results in the data store.

I will try the server data as well - problem i have with that is it's not very flexible in terms of what i pass in and the re-use of the server code - maybe i just don't know how. I will look at your live search example a bit more.

Another thing is initially my local data was an object obtained from the server using YAHOO's asyncRequest, then I used Ext.util.JSON.encode() to create a JSON string - but of course that didn't work as the JSON Reader requires each row in an object while the encode method (like other JSON encode methods I found on the net) groups ALL data of the same column in an array. So at the end I had to change my code on the server to make my result into a JSON string (using coldfusion) first.

I know that I can just use the array reader and the grid will work for me. But I really would like to see how JSON works and would love to have the paging facility.

By the way, I'm doing all these things for my own enjoyment (mostly torture though haha). When I see something new I itch to try it out. I'm most impressed with your work and can see that very soon a lot of apps out there will have similar interface. Keep up with the good work, and I'll make a donation when I get my next pay cheque. :wink:

03-11-2007, 06:30 AM

Hey Jack don't worry about it for now - you got more important things to worry about.

I just tried doing this:

var j = {"recordcount":3,"data":[{"category":"Computer Hardware","description":"whatever","id":"08206FAE-9610-0322-40E109F1CA47E6A5"},{"category":"Legal Fee","description":"ok","id":"08266405-B3EC-A27A-4DB17D714CA5E2B3"},{"category":"Petrol","description":"petrol","id":"0827BE9A-F9F5-D19E-04B52C69BCD10B33"}]};

and pass j into data store and it worked!! Man, I'm an idiot.

I'll try to sort it out and definitely will be back here when I'm pulling my hair again!

THANKS!

03-13-2007, 12:19 PM

Where did you get information for doing this ?

Looking the API DOCS, there's no refererence to:
Ext.data

Any idea ?

03-13-2007, 12:21 PM

Don't rely exclusively on the docs in the alpha builds. A lot of things are still not documented. You'll have to dig into the code or search the forums for some things.

__________________
Tim Ryan - Ext JS Support Team
Read BEFORE posting a question / posting a Bug
Use Google to Search - API / Forum
API Doc (3.x | 2.x | 1.x) / FAQ / Wiki / Tutorials / 1.x->2.0 Migration Guide

03-13-2007, 12:27 PM

Where can I see the source code for:
http://www.yui-ext.com/forum2/topics-remote.php ?

I wonder if there's a php class ready-made to work with yui-ext pager.