title: Load static JSON data from URL for ExtJS grid panel
body: <p>I tried to implement a grid panel using data from a JSON file which is located on the same domain as the Javascript file containing the ExtJs code. I'm using ExtJs 3.4.</p>
  
  <p>The grid shows up but without any data in it. Firebug shows an error message that tells me that there is an error in the first line of the JSON file ("not well formed"). I have validated the JSON file and everything is ok.</p>
  
  <p>Here is my code:</p>
  
  <pre class="lang-js prettyprint-override"><code>Ext.onReady(function () {
      var myStore = new Ext.data.JsonStore({
          url: 'data.json',
          root: 'rows',
          autoLoad: true,
          fields: [{
              name: 'person',
              type: 'string'
          }, {
              name: 'product',
              type: 'string'
          }]
      });
  
      var grid = new Ext.grid.GridPanel({
          id: 'gridPanel',
          title: 'Grid example',
          width: 250,
          height: 250,
          renderTo: 'grid-example',
          store: myStore,
          columns: [{
              header: 'Person',
              dataIndex: 'person'
          }, {
              header: 'Product',
              dataIndex: 'product'
          }]
      });
  });
  </code></pre>
  
  <p>My JSON data is:</p>
  
  <pre class="lang-js prettyprint-override"><code>{
      "rows": [{
          "person": "Jamie Avins",
          "product": "Ladder"
      }, {
          "person": "Ed Spencer",
          "product": "Spanner"
      }]
  }
  </code></pre>
  
  <p>Do you have any ideas what's wrong? Can somebody give me some hints?</p>
  
  <p>Thanks in advance!</p>
  
  <p>Seha</p>