title: Unable to load store data in EXTJS Simplestore using JavaScript
body: <p>I am trying to re-load data into the Store which is further used by a GridPanel. My code goes like:</p>
  
  <pre><code>Ext.onReady(function(){
  
      myData =     [
          ['document','listsk','123','','','rat'],
          ['hiiiii','himself','rest','','','lap']
      ];
  
      // create the data store
      store = new Ext.data.SimpleStore({
          fields: [
              {name: 'cat'},
              {name: 'desc'},
              {name: 'edcsId'},
              {name: 'transformedEDCSUrl'},
              {name: 'transformedFormatsUrl'},
              {name: 'lineNotes'}
          ]
      });
      store.loadData(myData);
  
      // create the Grid
      grid = new Ext.grid.GridPanel({
          store: store,
          columns: [
             {header: "&lt;b&gt;Category&lt;/b&gt;",  sortable: true, dataIndex: 'cat'},
             {header: "&lt;b&gt;Description or Document Title&lt;/b&gt;", sortable: true,  dataIndex: 'desc'},
             {header: "&lt;b&gt;EDCS ID #&lt;/b&gt;", sortable: true, renderer: renderEDCSUrl, dataIndex: 'edcsId'}
             {header: "&lt;b&gt;URLs to Formats&lt;/b&gt;", renderer: renderFormatsUrl},
             {id: 'lineNotes', header: "&lt;b&gt;Line Notes&lt;/b&gt;", sortable: true, dataIndex: 'lineNotes'}
          ],
          viewConfig: { 
              forceFit: true
          },
          autoExpandColumn: 'lineNotes',
          stripeRows: true,
          collapsible: true
      })
  
      reload = function refreshGrid(data){
          store.loadData(data);
      }
  })
  </code></pre>
  
  <p>The mydata variable as seen by Firebug is:</p>
  
  <pre><code>[
      ['document','listsk','123','','','rat'],
      ['hiiiii','himself','rest','','','lap']
  ]
  </code></pre>
  
  <p>And the data variable in the javascript function refreshGrid is also same:</p>
  
  <pre><code>[
      ['document','listsk','123','','','rat'],
      ['hiiiii','himself','rest','','','lap']
  ]
  </code></pre>
  
  <p>I am invoking the function refreshGrid as follow:</p>
  
  <pre><code>function load(response) {  
      reload(response.substring(response.indexOf('myData') + 9, 
             response.indexOf('function renderABC') - 2));
  }
  </code></pre>
  
  <p>To me it looks like a JSON parsing issue as data is coming fine from backend. Which is the best way to parse JSON string coming from backend. The behaviour with javascript invcation of <code>store.loadData</code> is that each character in the data variable is treated as separate row in the Grid as shown below:</p>
  
  <p><img src="https://i.stack.imgur.com/r5dlV.jpg" alt="ExtJS Problem"></p>