PDA

View Full Version : extjs grid, json request getting "Uncaught SyntaxError: Unexpected token :" error



mschlanser
2 Jan 2011, 1:30 PM
Hello,

I have a grid

mygrid.js

Ext.onReady(function(){
Ext.QuickTips.init();

var store = new Ext.data.JsonStore({
remoteSort: true,
baseParams: {lightWeight:true,ext: 'js'},
autoLoad: {params:{start:1, limit:2}},
//dataType: 'JSON',
proxy: new Ext.data.ScriptTagProxy({
url: 'getEmails.php',
//url: 'http://www.sencha.com/forum/topics-browse-remote.php'
}),

reader: new Ext.data.JsonReader({
//totalProperty: 'totalemails',
//root: 'emails',
//idProperty: 'messageid',
fields: [{name:'messageid', type:'int'}, {name:'subject', type:'string'}]
})
});

//store.load();

var grid = new Ext.grid.GridPanel({
renderTo: 'emailGrid',
width:700,
height:500,
frame:true,
title:'Found Emails',
trackMouseOver:false,
autoExpandColumn: 'subject',
store: store,

columns: [new Ext.grid.RowNumberer({width: 30}),{
id: 'messageid',
header: "ID",
dataIndex: 'messageid',
width: 40,
sortable:true
},{
id: 'subject',
header: "Subject",
dataIndex: 'subject',
width: 420,
sortable:true
}],

bbar: new Ext.PagingToolbar({
store: store,
pageSize:500,
displayInfo:true
}),

view: new Ext.ux.grid.BufferView({
// custom row height
rowHeight: 34,
// render rows as they come into viewable area.
scrollDelay: false
})
});



});

I then have a php script ( the getEmails.php ):




$emailArray = array();
$emailArray['totalemails'] = $foundmessagescount;
$emailArray['emails'] = array();

for ($i = $start; $i < ($limit+$start) && $i < count($search); $i++ ){
$subject = $storage->getMessage($search[$i])->subject;
$emailDet = array();
$emailDet['messageid'] = (int)$search[$i];
$emailDet['subject'] = $subject;
$emailArray['emails'][]= $emailDet;
}
$json = json_encode($emailArray);
$dec = json_decode($json);
echo $json;


The json code output looks like this :

{"totalemails":17,"emails":[{"messageid":1047,"subject":"no subject"},{"messageid":1780,"subject":"no subject"},{"messageid":1782,"subject":"no subject"}]}

I keep on getting the "Unexpected Token :" error and the grid won't load.

Any help is MUCH appreciated.

Thanks,
Mike

aramaki
2 Jan 2011, 3:14 PM
uncomment root in your store, may be your json content some special symbols like < or > ?, also may be you have some spaces in js file(s)

mschlanser
2 Jan 2011, 3:18 PM
Just tried your suggestion, still no go. Any other thoughts? If I put the json response for the example ( the commented out code in the js file, it works ). But the php file seems to be causing the problem maybe?

thanks,
Mike

evant
2 Jan 2011, 3:25 PM
An implementation of Ext.data.DataProxy that reads a data object from a URL which may be in a domain other than the originating domain of the running page.
Note that if you are retrieving data from a page that is in a domain that is NOT the same as the originating domain of the running page, you must use this class, rather than HttpProxy.
The content passed back from a server resource requested by a ScriptTagProxy must be executable JavaScript source code because it is used as the source inside a <script> tag.
In order for the browser to process the returned data, the server must wrap the data object with a call to a callback function, the name of which is passed as a parameter by the ScriptTagProxy. Below is a Java example for a servlet which returns data for either a ScriptTagProxy, or an HttpProxy depending on whether the callback name was passed:An implementation of Ext.data.DataProxy that reads a data object from a URL which may be in a domain other than the originating domain of the running page.
Note that if you are retrieving data from a page that is in a domain that is NOT the same as the originating domain of the running page, you must use this class, rather than HttpProxy.
The content passed back from a server resource requested by a ScriptTagProxy must be executable JavaScript source code because it is used as the source inside a <script> tag.
In order for the browser to process the returned data, the server must wrap the data object with a call to a callback function, the name of which is passed as a parameter by the ScriptTagProxy. Below is a Java example for a servlet which returns data for either a ScriptTagProxy, or an HttpProxy depending on whether the callback name was passed.


http://dev.sencha.com/deploy/dev/docs/?class=Ext.data.ScriptTagProxy

mschlanser
2 Jan 2011, 3:27 PM
Thanks for the quick response, however, this is returning from the same domain ( or am I missing something? ). Does this need to be a js return? How would I do that?

Thanks,
Mike

P.S. Sorry for dumb questions, I'm used to the GWT ext and not pure js.

evant
2 Jan 2011, 3:37 PM
My point was, why are you using a ScriptTagProxy in the first place? Use an HttpProxy.

mschlanser
2 Jan 2011, 3:41 PM
OH!! Thanks!! i just tried using



proxy: new Ext.data.HttpProxy({
url: 'getEmails.php',
//url: 'http://www.sencha.com/forum/topics-browse-remote.php'
}),


Now its not getting the error but still not showing in the Grid.

Thanks,
Mike

skirtle
2 Jan 2011, 4:04 PM
Have you tried removing the stray comma from the end of your URL?

mschlanser
2 Jan 2011, 4:08 PM
@skirtle - Thanks!! Didn't realize that was there. Just tried it, still nada. Do I have to have a renderer for the columns in the grid, or will it auto display simple text?

Also, I am receiving "XHR finished loading: "http://www.mydomain.com/getEmails.php" instead of the error from before if that helps at all.

Thanks,
Mike

skirtle
2 Jan 2011, 4:47 PM
You don't need to explicitly specify the HttpProxy, if you just specify a url on the store it'll use an HttpProxy by default.

You also don't need to specify the JsonReader, a JsonStore uses one by default. Put the config options for the reader directly on the store instead. You'll need to uncomment the root property from your original example. Something like this:


var store = new Ext.data.JsonStore({
remoteSort: true,
baseParams: {lightWeight:true,ext: 'js'},
autoLoad: {params:{start:1, limit:2}},
//dataType: 'JSON',
url: 'getEmails.php',
totalProperty: 'totalemails',
root: 'emails',
idProperty: 'messageid',
fields: [{name:'messageid', type:'int'}, {name:'subject', type:'string'}]
});

mschlanser
2 Jan 2011, 4:52 PM
@skirtle - Thanks man. much appreciated. Its still not showing in the grid ( after i put your change in ), not sure exactly whats going on. I'll put an update in the morning. I have a feeling its probably something stupid I'm doing.

Thanks again,
Mike