GridPanel dans Extjs n'est pas chargé

Question

J'ai ce code dans mon application, mais cela ne charge aucune donnée. Les données sont accessibles mais ne s'afficheront pas dans ma grille, tout le monde a une idée, pourquoi?

Ext.onReady(function() { 
     Ext.QuickTips.init(); 
     Ext.form.Field.prototype.msgTarget = 'side'; 

     var btnAdd = new Ext.Button({ 
      id: 'btnAdd', 
      text: 'Adicionar', 
      iconCls: 'application_add', 
      handler: function (s) { 

      } 
     }); 
     var btnEdit = new Ext.Button({ 
      id: 'btnEdit', 
      text: 'Editar', 
      iconCls: 'application_edit', 
      handler: function (s) { 

      } 
     }); 
     var btnRemove = new Ext.Button({ 
      id: 'btnRemove', 
      text: 'Apagar', 
      iconCls: 'application_delete', 
      handler: function (s) { 

      } 
     }); 

     var tbar = new Ext.Toolbar({ 
      items: [btnAdd, btnEdit, btnRemove] 
     }); 

     var formFind = new Ext.FormPanel({    
      height: 100 
     }); 

     var store = new Ext.data.JsonStore({ 
      remoteSort: true, 
      idProperty: 'ContentId', 
      root: 'rows', 
      totalProperty: 'results', 
      fields: [ 
       { name: 'ContentId', type: 'int' }, 
       { name: 'Name' }, 
       { name: 'Version' }, 
       { name: 'State' }, 
       { name: 'CreatedDateTime' }, 
       { name: 'PublishedDateTime'}, 
       { name: 'CreatedByUser' }, 
       { name: 'PublishedByUser' } 
      ], 
      proxy: new Ext.data.ScriptTagProxy({ 
       url: '/Admin/ArticleList' 
      }) 
     }); 
     store.setDefaultSort('ContentId', 'desc'); 

     var paging = new Ext.PagingToolbar({ 
      store: store, 
      pageSize: 25, 
      displayInfo: true, 
      displayMsg: 'Foram encontrados {2} registos. Mostrando {0} de {1}', 
      emptyMsg: "Nenhum registo encontrado." 
     }); 

     var grid = new Ext.grid.GridPanel({ 
      id: 'grid', 
      height: 700, 
      store: store, 
      loadMask: true, 
      loadingText: 'Carregando...', 
      autoHeight: true, 
      cm: new Ext.grid.ColumnModel ([ 
       { id: 'ContentId', dataIndex: 'ContentId', header: 'Identif.', width: 60, sortable: true }, 
       { id: 'Name', dataIndex: 'Name', header: 'Titulo', width: 75, sortable: true }, 
       { id: 'Version', dataIndex: 'Version', header: 'Versão', width: 75, sortable: true }, 
       { id: 'State', dataIndex: 'State', header: 'Estado', width: 75, sortable: true }, 
       { id: 'CreatedDateTime', dataIndex: 'CreatedDateTime', header: 'Data de Criação', width: 85, sortable: true }, 
       { id: 'PublishedDateTime', dataIndex: 'PublishedDateTime', header: 'Data de Publicação', width: 75, sortable: true }, 
       { id: 'CreatedByUser', dataIndex: 'CreatedByUser', header: 'Criado por', width: 75, sortable: true }, 
       { id: 'PublishedByUser', dataIndex: 'PublishedByUser', header: 'Publicado por', width: 85, sortable: true } 
      ]), 
      stripeRows: true, 
      viewConfig: { forceFit: true }, 
      bbar: paging 
     }); 

     var panel = new Ext.Panel({ 
      id: 'panel', 
      renderTo: Ext.getBody(), 
      layout: 'fit', 
      tbar: tbar, 
      items: [grid] 
     }); 

     store.load(); // trigger the data store load 
    }); 

Answer 1

Vous ne devriez pas utiliser ScriptTagProxy. Si vous lisez les documents, vous verrez qu'ils ne sont utilisés que dans des cas limités pour extraire le contexte du serveur distant dans un format particulier.

Vous voulez plutôt un HttpProxy. Que se passe-t-il lorsque le code est exécuté?