GRID неправильно отображается в ExtJS 4 с помощью Store - PullRequest
Новая
       84

GRID неправильно отображается в ExtJS 4 с помощью Store

2 голосов
/ 29 марта 2012

Вот код Src для файла HTML 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4 /strict.dtd">
<html>
<head>
<title>MVC Architecture</title>
<link rel="stylesheet" type="text/css" href="/bh/extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs/ext-debug.js"></script>
<script type="text/javascript" src="Main.js"></script>
</head>
<body>
</body>
</html>

Путь к файлу: /bh/Main.js [Основной файл] 

Ext.require('Ext.container.Viewport');
Ext.application({
name: 'App',
appFolder: 'app',
controllers: ['UserController'],

launch: function() {

Ext.create('Ext.container.Viewport', {
layout: 'border',
items: [
        {
            xtype: 'userList'
        }
       ]
  });
 }
});

Путь к файлу: /app/controller/UserController.js [Контроллер] 

Ext.define('App.controller.UserController',{
 extend: 'Ext.app.Controller',
 stores: ['UserStore'],
 models:['UserModel'],
 views:['user.UserList'],
 init: function() {
  this.getUserStoreStore().load();
  }
});

Путь к файлу: /app/store/UserStore.js

 Ext.define('App.store.UserStore', {
  extend: 'Ext.data.Store',
  model: 'App.model.UserModel',

  proxy: {
   type: 'ajax',
   url: 'app/data/contact.json'
  }
});

Путь к файлу: /app/model/UserModel.js [Модель] 

Ext.define('App.model.UserModel',{
extends:'Ext.data.Model',
fields:[
    {name: 'name', type: 'string'},
    {name: 'age', type: 'string'},
    {name: 'phone', type: 'string'},
    {name: 'email', type: 'string'}
]
});

Путь к файлу: /app/view/UserList.js [Просмотр] 

Ext.define('App.view.user.UserList' ,{
extend: 'Ext.grid.Panel',
alias:'widget.userList',
title:'Contacts',
region:'center',
resizable:true,
initComponent: function() {
this.store = 'UserStore';
this.columns = [
          {text: 'Name',flex:1,sortable: true,dataIndex: 'name'},
          {text: 'Age',flex:1,sortable: true,dataIndex: 'age'},
          {text: 'Phone',flex:1,sortable: true,dataIndex: 'phone'},
          {text: 'Email',flex:1,sortable: true,dataIndex: 'email'}
        ];

this.callParent(arguments);
}

});

При пожаре ошибка показывает ответ JSON следующим образом: 

[{
  "name": "Aswini",
   "age": "32",
   "phone": "555-555-5555",
   "email": "aswininayak@.in"
 }]

Почему данные не отображались, хотя у меня есть действительный ответ json. Пожалуйста, помогите !!!

enter image description here

Ответы [ 2 ]

0 голосов
/ 06 октября 2012

Вы должны настроить свой ридер в прокси, как это: 

Ext.define('App.store.UserStore', {
    extend: 'Ext.data.Store',
    model: 'App.model.UserModel',
    proxy: {
        type: 'ajax',
        url: 'app/data/contact.json',
        reader: {
            type: 'json'
        }
    }
});
0 голосов
/ 09 апреля 2012

Я считаю, что ваша сетка не загружалась, потому что вы не загрузили магазин должным образом. Вы должны использовать. 

this.getStore('userStore').load();

вместо 

this.getUserStoreStore().load();
...