json数据未在模板中更新

时间:2012-05-28 07:42:23

标签: ajax templates extjs response

我的主要观点是

Ext.define("casta.view.Main", {
    extend: 'Ext.tab.Panel',
    apitoken:'NULL',
    callbackdata:'NULL',
    requires: [
        'Ext.TitleBar',
        'Ext.Video',
        'casta.view.Intro'

    ],
    config: {
        tabBarPosition: 'top',

        items: [
                 //intro.js actually need json rendering

                { title:'Intro',
                   xclass: 'casta.view.Intro' ,
                   iconCls:'user',
                   renderTo: document.body,

                 }

        ]
    }
});

我在intro.js

中调用了来自外部网址的json
 Ext.define('User', {
    extend: 'Ext.data.Model',
    fields: ['id', 'username']
})

Ext.define('casta.view.Intro', {
    extend: 'Ext.tab.Panel',
    alias: 'widget.Intro',

    requires: ['Ext.data.Store'],

    itemTpl: '{id} - {username}',

    initComponent: function(){
        this.store = new Ext.data.Store({
            autoLoad: true,
            model: 'User',
            proxy: {
                type: 'ajax',
                url: 'http://localhost:8000/api/casta/user/?format=json',
                reader: {
                    type: 'json',
                    root: 'objects'
                }
            }
        });
        this.callParent();
    }  
});

Ext.onReady(function(){
    Ext.create('Ext.tab.Panel', {
        width: 400,
        height: 400,
        renderTo: document.body,
        items: [{
            title: 'My View',
            xtype: 'Intro'
        }]
    })
});

我从回应得到的json如下

{"meta": {"limit": 20, "next": null, "offset": 0, "previous": null, "total_count": 2}, "objects": [{"date_joined": "2012-05-18T15:44:54", "first_name": "", "id": 1, "last_login": "2012-05-18T15:44:54", "last_name": "", "resource_uri": "/api/casta/user/1/", "username": "admin"}, {"date_joined": "2012-05-21T12:05:00", "first_name": "", "id": 29, "last_login": "2012-05-21T12:05:00", "last_name": "", "resource_uri": "/api/casta/user/29/", "username": "sumit"}]}

每当我保留静态字符串时,模板都会更新,否则模板不会更新。任何人都可以告诉我我要做什么..也有任何函数,如onload而不是initcomponent,因为我只想在调用此面板时调用ajax

1 个答案:

答案 0 :(得分:1)

你这完全是错误的方式。而不是试图修复你的例子,看看这个:

Ext.define('User', {
    extend: 'Ext.data.Model',
    fields: ['id', 'username']
})

Ext.define('MyView', {
    extend: 'Ext.view.View',
    alias: 'widget.myview',

    requires: ['Ext.data.Store'],

    itemTpl: '{id} - {username}',

    initComponent: function(){
        this.store = new Ext.data.Store({
            autoLoad: true,
            model: 'User',
            proxy: {
                type: 'ajax',
                url: 'data.json',
                reader: {
                    type: 'json',
                    root: 'objects'
                }
            }
        });
        this.callParent();
    }  
});

Ext.onReady(function(){
    Ext.create('Ext.tab.Panel', {
        width: 400,
        height: 400,
        renderTo: document.body,
        items: [{
            title: 'My View',
            xtype: 'myview'
        }]
    })
});