PDA

View Full Version : [SOLVED] Grid not loading JSON data



nbailey
22 Jan 2009, 1:10 PM
I have a grid, defined as follows:



var store=new Ext.data.Store({
proxy:new Ext.data.HttpProx({url:'http://www.health-prorehab.com/json/data.cfm'}),
reader: new Ext.data.JsonReader({
root:'data',
totalProperty:'total',
id:'referral_id',
fields:[
{name:'referral_id', mapping:'referral_id'},
{name:'name', mapping:'name'},
{name:'liason', mapping:'liason'},
{name:'facility',mapping:'facility'},
{name:'referral_date',mapping:'referral_date'},
{name:'bed_offer',mapping:'bed_offer'},
{name:'bo_date',mapping:'bo_date'},
{name:'admitted',mapping:'admitted'},
{name:'admit_date',mapping:'admit_date'},
{name:'discharged',mapping:'discharged'},
{name:'discharge_date',mapping:'discharge_date'}
]
}),
remoteSort:false
})

gp=new Ext.grid.GridPanel({
renderTo:'PatientGrid',
width:925,
height:250,
title:'Currently Existing Referrals & Patients',
store:store,
columns:[
{header:'id',dataIndex:'referral_id',hidden:true},
{header:'Patient',dataIndex:'name',width:125},
{header:'Liason',dataIndex:'liason',width:125},
{header:'Referring Facility',dataIndex:'facility',width:125},
{header:'Referral Date',dataIndex:'referral_date',width:75},
{header:'Bed Offer',dataIndex:'bed_offer',width:75},
{header:'BO Date',dataIndex:'bo_date',width:75},
{header:'Admitted',dataIndex:'admitted',width:75},
{header:'Admit Date',dataIndex:'admit_date',width:75},
{header:'Discharged',dataIndex:'discharged',width:75},
{header:'Discharge Date',dataIndex:'discharge_date',width:100}
],
frame:true,
collapsible :true,
collapsed:false,
trackMouseOver:false,
sm:new Ext.grid.RowSelectionModel({selectRow:Ext.emptyFn}),
loadMask:true
});

store.load();


The grid gets created and displayed correctly. It fires the load call (firebug shows the call being made and returning correctly). When I access the page w/ params directly in a browser, I get the data structure, which is correct:



[
{"data":[
{
"referral_id":"02EDA2FD301BB65887E82FA627A64691",
"name":"Patient XXX",
"liason":"Liason XXX",
"referral_date":"12/02/2008",
"facility":"Facility XXX",
"bed_offer":"false",
"bed_offer_date":"",
"admit":"false",
"admit_date":"",
"discharge":"false",
"discharge_date":"",
"category":"Pending Bed Offer"
},{
"referral_id":"07F97A1C301BB658873D713CBB28E376",
"name":"Patient XXX",
"liason":"Liason XXX",
"referral_date":"12/04/2008",
"facility":"Facility XXX",
"bed_offer":"false",
"bed_offer_date":"",
"admit":"false",
"admit_date":"",
"discharge":"false",
"discharge_date":"",
"category":"Pending Bed Offer"
}
],"total":2}]


Nothing is displayed in the grid! the loading mask fires, and seems to....load...but it never displays anything. I tried putting an onload event function that simply displays an alert box, but it never gets fired.

I have tried everything. I had the store's field array defined differently (I don't believe you need an object defining the name and the mapping values if the name and the mapping values are the same, but I changed it anyway..just in case...).

If ANYONE has any ideas, I am dead in the water right now.

As always, much appreciated.

anshubansal2000
22 Jan 2009, 1:12 PM
Are you putting Grid into a Panel?? Try that. Can you also post the code how to put grid in a panel.

nbailey
22 Jan 2009, 1:16 PM
I DID include the code above showing how I put the grid into a grid panel. I posted ALL of the grid code above.

Am I missing something? I have dozens of EXT grids across our site that look just like the grid above, and they all work.

I can't figure out WHY the heck this one doesn't display the data.

mjlecomte
22 Jan 2009, 1:21 PM
You tried everything? Did you check the Grid FAQ? Did you specify a loadexception listener and does it fire? I suspect yes, if the load listener is not firing. If so, inspect the loadexception arguments, particularly the 4th one.

nbailey
22 Jan 2009, 1:27 PM
Mjlecomte,

I appreciate the pointer. I will look there now.

nbailey
22 Jan 2009, 1:33 PM
according to the API docs, the loadException event doesn't pass any arguments to the listeners. Am I missing something?

mjlecomte
22 Jan 2009, 1:38 PM
http://extjs.com/forum/showthread.php?p=277259#post277259

tryanDLS
22 Jan 2009, 1:46 PM
The arg list is a doc error -

Fires if an exception occurs in the Proxy during loading. Called with the signature of the Proxy's "loadexception" event.

mjlecomte
22 Jan 2009, 1:48 PM
The arg list is a doc error -

Seems ok? The loadexception is relayed down, so it is the proxy that generates the error....no?

mjlecomte
22 Jan 2009, 1:50 PM
Oh, I see what you mean:



loadexception : ()
Fires if an exception occurs in the Proxy during loading. Called with the signature of the Proxy's "loadexception" event.

Listeners will be called with the following arguments:

None.

nbailey
22 Jan 2009, 1:52 PM
I have NO idea. It is definitely firing an error: "TypeError: M is undefined"

I have no friggin idea where the hell the M is coming from.

I had searched thru the forums for loadException, and actually found a post you had put up before w/ the link to the HttpProxy loadException definition. So I have the error popping up. But in the post you had responded to earlier, it seems his JSON definition was incorrect (his data root was not an array; mine definitely is), and I don't _think_ that is the case here (tho at this point I am willing to try almost any damn thing).

Again I appreciate your assistance.

nbailey
22 Jan 2009, 1:58 PM
I found it. My friggin JSON data WAS malformed. Some moron (yes, that would be me) wrapped the entire JSON string in brackets for some ridiculous reason.

Again, mjlecomte, I appreciate your pointer to the loadException event. I will not forget it.

mschwartz
22 Jan 2009, 2:05 PM
I don't think that loadException works with scriptTagProxy. Actually, quite sure of this.

It may not work with forms submitted via invisible iframe, either (e.g. fileUpload=true)

mjlecomte
22 Jan 2009, 2:08 PM
I don't think that loadException works with scriptTagProxy. Actually, quite sure of this.

It may not work with forms submitted via invisible iframe, either (e.g. fileUpload=true)
I think it may, this is in scriptTagProxy source:


handleFailure : function(trans){
this.trans = false;
this.destroyTrans(trans, false);
this.fireEvent("loadexception", this, null, trans.arg);
trans.callback.call(trans.scope||window, null, trans.arg, false);
}

mschwartz
22 Jan 2009, 2:11 PM
I think it may, this is in scriptTagProxy source:


handleFailure : function(trans){
this.trans = false;
this.destroyTrans(trans, false);
this.fireEvent("loadexception", this, null, trans.arg);
trans.callback.call(trans.scope||window, null, trans.arg, false);
}

It can't.

It's adding script tag to the DOM and the JS coming in could be a PHP error message or something. The browser barfs on the invalid Javascript but nobody's doing try/catch to catch it nor can they.

To be more clear.

1) Ext adds script tag to the DOM.

2) Browser in it's own sweet time fetches the javascript from the server and tries to add it to the DOM, as if the script tag was in the original HTML source.

3) Browser can't parse it, what does it do? Same as it does when it gets 404 for some .js you ask for in your HTML. Silently nothing.

4) You don't have an XHR so no way to listen for browser barfing on bad script inside script tag and throw/cause error event.

mschwartz
22 Jan 2009, 2:20 PM
BTW,

You might be able to trap that error with a document.onError, but it's not at all cross browser supported.