View Full Version : Grid panel does not load data

20 May 2010, 1:20 PM
Please let me know if I'm missing a step here. I used the Designer to draw out a grid panel. I then created a XML store and hooked that to the grid panel. The store is hitting against a server that publishes right data. Configurations seems to be correct, b/c when I hit the load data button, I see rows brought back and populated in the design view grid.

However, when I save the project and export the code, and render the generated .html file, I can't get the data to populate within the grid panel.

Am I missing something here?

21 May 2010, 7:22 AM
Did you confirm that the data is indeed loading from your server correctly in, e.g., Firebug? Sometimes when users setup a Prefix URL and use relative paths in their Store URLs, they don't deploy the exported code to a directory on their local web server that matches up with their relative paths (or simply open the exported html file directly, instead of loading it up through their local web server).

If you're using an absolute URL, just double check first that the data is loading with Firebug or an equivalent tool. If it is loading properly and there isn't any Javascript errors, I can help you diagnose further.

21 May 2010, 7:40 AM
Yeah, I'm getting the same problem with a JSON store.

I get data appearing in the designer when I do a "Load data" so I know the URL is correct, but it's not loaded when I open the exported project.

I have autoLoad set to true.

21 May 2010, 8:24 AM
can you attach your project file and a file containing your sample data set?

21 May 2010, 9:09 AM
I don't have a prefix URL set within the Designer preference. Should I have one set? I can confirm that data is loading to my XML store within the Designer (I can see the data within the grids). I can't confirm that it is loading when rendering the generated html file. I don't see any sort of requests within my console. My XML store is hooked to an internal web-service that publishes the XML data. We are using Presto Mashups (this information may be irrelevant, as long as the XML schema is correct).

Any thoughts @jarrednicholls?

21 May 2010, 10:01 AM
No, you don't need a url prefix setup if you're using an absolute (fully qualified) URL for your store. The fact that it's loading in the Designer view means it's setup correctly if it's an absolute URL. The only thing to confirm next is whether or not it's being loaded by your browser. Do you have Firebug installed in Firefox? You can check the "Net" tab and see if the XML is being loaded by the Store (since you said it's set to autoLoad). There being no errors in the Console is a good sign.

21 May 2010, 10:12 AM
I checked Firebug. Within the Net tab, there is no XML being loaded by the Store. Also checked the XHR sub-tab. There is 0 requests logged... This is all coming from Designer generated code.

21 May 2010, 10:23 AM
Oops, I apologize -- correction. I see two hits against the web service URL. But, I don't see any data coming back. It gives a '?' within the Size column. It's weird, I see it's a OPTIONS type of request. I was really expecting a GET.

21 May 2010, 12:16 PM
Are you attempting to do a cross-domain XHR request? If so, you should be aware that this isn't supported naturally by a browser as it's a security risk. Firefox will send an OPTIONS request first before the actual request if it's cross-domain XHR. Do a Google search on this topic for more information.

With that said, it does work in the Designer because we have our internal WebKit instance allow outbound cross-domain requests. But this isn't the case for regular desktop browsers.

24 May 2010, 5:13 AM
Yes, the web-service will be cross-domain-ed. Is there a bridge across the issue? Designer is fine and dandy. But wouldn't do us a lot of good if the exported code produces a different end-result (wouldn't populate the grid).

What is it that I can do to tweak on the exported code side to make this work? Would I need to manually add a proxy? If so, I think scriptTagProxy would be the only solution right?

24 May 2010, 5:36 AM
ScriptTagProxy won't work with XML data, it can only process "javascript code", and thus only a JSON object. A ScriptTagProxy is the best cross-browser solution for a cross-domain request at the moment, but you will need to convert your XML object into a JSON object before returning it. If you can do that, then a ScriptTagProxy is the solution - in a JsonStore implementation .js file, add a proxy configuration set to a ScriptTagProxy just below the "storeId" configuration. Hope that helps!

24 May 2010, 6:59 AM
Thanks for all the help jarrednicholls...

I think I'm getting close. I added the ScriptTagProxy within the jsonStore.js file. I see from FF that it's hitting the web-service url with GET and brought back the correct JSON data. But, I still don't see any data populated within the grid when rendering the generated HTML file. Am I missing anything else?

24 May 2010, 7:15 AM
The ScriptTagProxy will load a <script> tag onto your page. When the proxy calls your web server, it's passing a parameter named "callback" that you must wrap around your resulting JSON object. For example:

JSON to return:

[{"id":1,"name":"Test 123"},{"id":2,"name":"Test 456"}]

This is what you actually return from the web server:

stcCallback123([{"id":1,"name":"Test 123"},{"id":2,"name":"Test 456"}])

stcCallbackXX is pulled from the "callback" parameter. See the ScriptTagProxy docs for more detail: http://www.extjs.com/deploy/dev/docs/?class=Ext.data.ScriptTagProxy

I would suggest having your web server do a check for an existing "callback" parameter...if it exists, you wrap your JSON with it...if it doesn't exist, you simply return the JSON verbatim. That way, the same endpoint handler will work with a vanilla JsonStore loading the data within the Designer, as well as your modified JsonStore + ScriptTagProxy in the exported code. Note: the Designer does overwrite your exported Store files, so I recommend creating a second file that inherits your exported Store class and therefore won't continually be overwritten. Perhaps different proxy support will be integrated directly into the Designer in the future.

24 May 2010, 9:54 AM
Are you familiar with Presto Mashups? That's what we are using to publish our data (by writing mashups via EMML). I'm not quite sure if their API allows one to manually format the json object. Could I somehow intercept the json object returned and tack on the callback wrapper from the client-side...then pass it to ScriptTagProxy?