PDA

View Full Version : grid using JSON source giving an error



invantix
27 Jun 2012, 12:05 PM
I have been YUI for a while and am considering converting to Extjs 4. I made a lot of progress in a short time and I like the strucure of the framework a lot. I am working with grids. I started with a simple local array datastore which worked fine and now am moving up to a remote JSON source. I have a lot of rest/json services to render so I need to get this working.

I am getting an error and my chrome debugger is pointing at the JSON result set. I ran the result set through JSONLint and it verified fine. I also took all of the renering formats out of the columns to keep it simple. I am not sure what else to try.

Here is my code:



Ext.onReady(function(){

Ext.define('WorkOrderModel', {
extend: 'Ext.data.Model',
fields: [
{name: 'WorkOrder', type:'string'},
{name: 'Lot', type:'int'},
{name: 'Op', type:'int'},
{name: 'Resource', type:'string'},
{name: 'SchedStart', type:'date'},
{name: 'SchedFinish', type:'date',sortDir: 'DESC'},
{name: 'Qty', type:'int',sortDir: 'DESC'},
{name: 'QtyComp', type:'int', sortDir: 'DESC'},
{name: 'QtyRem', type:'int', sortDir: 'DESC'},
{name: 'HrsRun', type:'float', sortDir: 'DESC'},
{name: 'HrsRem',type:'float', sortDir: 'DESC'},
{name: 'Percent',type:'float', sortDir: 'DESC'}
],
idProperty: 'WorkOrder'
});

var store = Ext.create('Ext.data.Store', {
id: 'store',
model: 'WorkOrderModel',
proxy: {
type: 'jsonp',
url: '/do/getWorkorderOperations',
extraParams: {
workOrderNumber: 'NC133777',
lot: '1'
},

reader: {
root: 'ResultSet.Result'
}
}
});



var grid = Ext.create('Ext.grid.Panel', {

width: 1000,
height: 500,
title: 'Workorder Operations',
store: store,
loadMask: true,
viewConfig: {
stripeRows: true,
enableTextSelection: true
},

columns: [
{text : 'WorkOrder',dataIndex: 'WorkOrder'},
{text : 'Lot',dataIndex: 'Lot'},
{text : 'Op',dataIndex: 'Op'},
{text : 'Resource', dataIndex: 'Resource'},
{text : 'SchedStart',dataIndex: 'SchedStart'},
{text : 'SchedFinish',dataIndex: 'SchedFinish'},
{text : 'Qty',dataIndex: 'Qty'},
{text : 'QtyComp',dataIndex: 'QtyComp'},
{text : 'QtyRem',dataIndex: 'QtyRem'},
{text : 'HrsRun',dataIndex: 'HrsRun'},
{text : 'HrsRem',dataIndex: 'HrsRem'},
],

renderTo: Ext.getBody()
});



store.load();

});


And here is the error.

36600

If anyone has an idea what could be going on here, thanks in advance.

Chris

carol.ext
27 Jun 2012, 12:15 PM
Looks like you need an ajax proxy rather than a jsonp proxy.

Check the API.

http://docs.sencha.com/ext-js/4-1/#!/api/Ext.data.proxy.Ajax
http://docs.sencha.com/ext-js/4-1/#!/api/Ext.data.proxy.JsonP


The JsonP proxy is useful when you need to load data from a domain other than the one your application is running on. If your application is running on http://domainA.com it cannot use Ajax to load its data from http://domainB.com because cross-domain ajax requests are prohibited by the browser.

invantix
27 Jun 2012, 1:02 PM
I updated the code and set proxy type to ajax and added type:'json' to the reader. Now that data is processing.


var store = Ext.create('Ext.data.Store', {
id: 'store',
model: 'WorkOrderModel',
proxy: {
type: 'ajax',
url: '/do/getWorkorderOperations',
extraParams: {
workOrderNumber: 'NC133777',
lot: '1'
},
reader: {
type: 'json',
root: 'ResultSet.Result'
}
}