PDA

View Full Version : Cannot load data into a grid programmatically



naddaf
14 Sep 2009, 7:37 AM
Hello Everyone.

I am new to Ext JS and am running into a problem that is most likely a silly error on my side. I have a combo box and a grid; when I select an item in my combo, I make an AJAX call to my server and receive a JSON array based on the selectesion in my combo box. Then I am trying to populate my grid with loadData(myJsonData). Here is the code snippet inside my select event handler on the combo:

--------------------------
Ext.Ajax.request({
url: 'getContacts?format=none&0=' + serviceName,
method: 'GET',
success: function(responseObject) {
var jsonContent = responseObject.responseText;
alert(jsonContent);
gridStore.loadData(jsonContent);
},
failure: function() {
Ext.Msg.alert('Status', 'Unable to show contacts at this time. Please try again later.');
}
});
------------------

The particular issue I have is that the "alert" shows the correct JSON array (also confirmed by firebug). However, my data doesn't show up in my grid (actually my grid shows many too many empty lines based on teh scrool bar). To debug further, I just copied the very same response that I got from my ajax response (copied from the alert box, for example) and put that in a local variable and replaced the above loadData() with the following one: "gridStrore.loadData(myLocalJsonArray)"
and it populates that perfectly, so I know my grid reader and store are fine but for some reason unknown to me, passing that array to loadData and using a local version of the very same data behave differently. Could someone please let me know what I am doing wrong?

Many thanks,
Ali.

14 Sep 2009, 8:21 AM
You have to encode the data.
gridStore.loadData(Ext.encode(jsonContent));

14 Sep 2009, 8:22 AM
Also, do yourself a favor and debug with Ext.Debug console or Firebug instead of alerts.

Mike Robinson
15 Sep 2009, 5:15 PM
Been there ... recently. Done that.

Suggestions:


Surf over to the "examples" page and spend an afternoon methodically reading through each one, including the source-code. Restrain yourself from further coding (no matter what it takes...) until you have seriously done that.
Get Firefox, and the Firebug plug-in, and once again, seriously spend an afternoon or two getting to know it.

The time will be "hugely well-spent." ~o)

Once you can (with Firebug) see what the client and the server are saying to each other, as you peruse the published examples (and watch them in action on your browser), it will help.

You will go through a few days of pure :((... then ... it will ... start ... to click.

naddaf
15 Sep 2009, 6:29 PM
but I don't know where you have got the idea that my issue had anything to do with the communication between the server and client. If you read my question again, you will notice that I had been using firebug and had been watching the request/response in firebug. The earlier reply answered my question.

jarlau
15 Sep 2009, 6:36 PM
You have to encode the data.
gridStore.loadData(Ext.encode(jsonContent));

Did you mean decode()?

naddaf
15 Sep 2009, 6:39 PM
Yes, it should be decode() and that fixed my issue, I realized it was a minor typo.
Thanks
Ali