PDA

View Full Version : JSON Response



JoeWhitlock
23 Mar 2012, 10:09 AM
I am new to Ext JS and want to learn the MVC way of doing things from the start. Using examples/app/simple as my test on how to bring in data from my server and display in the grid.
Below is my testing results using Firebug.
If my store is setup like the example, I get the error: a.indexOf is not a function on line 15 of ext-all.js
1 Ext.define('AM.store.Users', {
2 extend: 'Ext.data.Store',
3 model: 'AM.model.User',
4 autoLoad: true,
5 proxy: {
6 type: 'rest',
7 url: {
8 read: '../../power/simple/getusers.php',
9 update: '../../power/simple/updateusers.php',
10 },
11 reader: {
12 type: 'json',
13 root: 'users',
14 successProperty: 'success'
15 }
16 }
17});

If I change the store just a little there are no errors, but my JSON is not being returned.
1 Ext.define('AM.store.Users', {
2 extend: 'Ext.data.Store',
3 model: 'AM.model.User',
4 autoLoad: true,
5 proxy: {
6 type: 'ajax',
7 url: '../../power/simple/getusers.php',
8 reader: {
9 type: 'json',
10 root: 'users',
11 successProperty: 'success'
12 }
13 }
14});

Here is my response
[["USER1 ","John Doe ","John.Doe@MyEmail.com "],["USER2 ","Jane Doe ","Jane.Doe@MyEmail.com "],["USER3 ","Baby Doe ","Baby.Doe@MyEmail.com "]]

The Ext JS knows there are three records. How should the JSON be formated so it will display?

Farish
23 Mar 2012, 10:33 AM
in your first code, replace "url" with "api" and remove the extra comma after the 2nd url. this will surely cause problems in IE. you are using root in your reader whereas in your JSON data you have no root. you can use either:


["users": [{"USER1","John Doe","John.Doe@MyEmail.com"},{"USER2","Jane Doe","Jane.Doe@MyEmail.com"},{"USER3","Baby Doe","Baby.Doe@MyEmail.com"}]]

or remove the root parameter and use:


[{"USER1","John Doe","John.Doe@MyEmail.com"},{"USER2","Jane Doe","Jane.Doe@MyEmail.com"},{"USER3","Baby Doe","Baby.Doe@MyEmail.com"}]

Farish
23 Mar 2012, 10:37 AM
you can use the following to see your store and the data contained in it using Firebug:


store.on('load', function() {
console.log(store);
})