View Full Version : ExtJs 4 Add records to the grid from JSON

22 Jan 2012, 9:07 AM
I'm a new ExtJS user, and I have the following problem. I'm trying to load some data to the ExtJS grid, which is serialized to json on the server (i use django serialize() method), but i'm getting an empty grid. The problem seems to be in the callback function, which loads the data to the grid, but i can't solve it.
Here is my code:

var ul = this.getStore('Users');
scope :this,
callback : function(records, operation, success){
for(i in records){
/* here, i think, should be a code that assigns values from json to the grid records */
console.log(records[i].get('fields').name, records[i].get('fields').email);
json-data, which i get from the server

{success:true, "students":[{"pk": 1, "model": "poll.student", "fields": {"name": "Bob", "email": "bob@mail.ua"}}, {"pk": 2, "model": "poll.student", "fields": {"name": "Sam", "email": "sam@gmail.com"}}]}
my model

Ext.define('AM.model.User', {
extend: 'Ext.data.Model',
idProperty: 'pk',
fields: [{
name: 'fields',
type: 'object'
my store

Ext.define('AM.store.Users', {
extend: 'Ext.data.Store',
model: 'AM.model.User',
// autoLoad: true,

proxy: {
type: 'ajax',
api: {
read: '/ex/'
reader: {
idProperty: 'pk',
type: 'json',
root: 'students',
successProperty: 'success'

Thanks to all!

22 Jan 2012, 11:44 AM
You shouldn't need a callback, it should all be automatic.

What do the dataIndex values on your grid look like? Are you using a renderer on your grid columns to pull apart your object fields?

Usually for something like this you wouldn't use an field containing an object, you'd pull it apart in the field mappings:

fields: [
{name: 'name', mapping: 'fields.name'},
{name: 'email', mapping: 'fields.email'}

You can then use these fields for your dataIndex values on your columns. Note that columns do not support dot-notation for the dataIndex, it must just be a field name.

I've omitted the types in my field definitions above. You can include them if you want but they aren't necessary unless you want to perform some sort of type conversion.

23 Jan 2012, 4:19 AM
Thank you, skirtle, for turning me into the right direction. I've solved the problem.