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

[mschlanser]

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]

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]

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]

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/doc...ScriptTagProxy

[mschlanser]

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]

My point was, why are you using a ScriptTagProxy in the first place? Use an HttpProxy.

[mschlanser]

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]

Have you tried removing the stray comma from the end of your URL?

[mschlanser]

@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]

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'}]
});