donny_barko
donny_barko

Reputation: 81

ExtJs 4 Add records to the grid from JSON

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:

Controller-function

    renderStudentList:function(){
            var ul = this.getStore('Users');                
            ul.load({
                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": "[email protected]"}}, {"pk": 2, "model": "poll.student", "fields": {"name": "Sam", "email": "[email protected]"}}]}

my model

Ext.define('AM.model.User', {
    extend: 'Ext.data.Model',
    idProperty: 'pk',
    fields: [{
        name:'pk', 
        type:'integer'
    },{
        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!

Upvotes: 1

Views: 1221

Answers (1)

hmak.soft
hmak.soft

Reputation: 51

I think your json should like this if i am not wrong:

{success:true, "students":[{"pk": 1, "fields": {"name": "Bob", "email": "[email protected]"}}, {"pk": 2, "fields": {"name": "Sam", "email": "[email protected]"}}]}

This will be done in python something like this: after you recieve your json string: Now in your json string;

actual_data = [d['students']['pk'], d['fields'] for d in json]
output = "{"
output += "success: true"
output += json.dumps(actual_data)
output += "}"
return HttpResponse(output)

Upvotes: 1

Related Questions