sencha touch ajax 加载列表

Posted 2023-02-26

【中文标题】sencha touch ajax 加载列表

【英文标题】：sencha touch ajax load list

【发布时间】：2011-11-16 06:23:00

【问题描述】：

这是我的代码 我想通过 Jsonp 加载一些数据并显示为列表项。

Ext.setup(
    onReady: function()

        Ext.regModel('Provinces', 
            fields: [
                name: 'ProvinceID',
                type: 'int'
            , 
                name: 'ProvinceName',
                type: 'string'
            ]
        );

        var store = new Ext.data.Store(
            autoLoad: true,
            model: 'Provinces',
            fields:['ProvinceName', 'ProvinceID'], 
            proxy: 
                url: 'http://172.19.44.122/BC/Home/GetProvices',
                type: 'jsonp'  
            ,
              autoLoad:true
        );

        new Ext.List(
            fullscreen: true,
            itemSelector: '.province',
            tpl: '<tpl for="."><div class="province">ProvinceName - ProvinceID</div></tpl>',
            store: store
        );
    
);

JSONP 数据如下所示：

Ext.data.JsonP.callback1(["ProvinceID":1,"ProvinceName":"shanghai","ProvinceID":2,"ProvinceName":"zhejiang"]);

但结果是页面只显示两个空行。

【参考方案1】：

您应该在列表中使用 itemTpl 属性，而不是 tpl，如下所示：

new Ext.List(
    fullscreen: true,        
    itemTpl: 'ProvinceName - ProvinceID',
    store: store
);