我们可以在Sencha Container中使用Grid吗?

时间:2014-01-07 09:53:00

标签: mobile extjs sencha-touch sencha-touch-2

我想从sencha商店中显示一个列表。我想将它显示为带有标题的表格,因此我认为Grid非常适合它。但我收到此错误

未捕获TypeError:无法调用未定义的方法'substring'
是否因为我使用Grid作为Container中的项目?如果不是问题,我怎样才能实现目标?

我已经评论过Grid。我使用“列表”来显示记录但是因为我想在列表中添加标题,我认为Grid会更容易做到。

'Ext.define(“PocketCRM.view.InvestorsList” ,{         extend:“Ext.Container”,         要求:[             “Ext.dataview.List”         ]         别名:“widget.investorslistview”,         config:{         布局:{             键入:“vbox”,

    },
    items: [
        {
            xtype: "toolbar",
            docked: "top",
            title: "Investor Details",

            items: [
                {
                    xtype: "button",
                    ui: "back",
                    text: "Back",
                    itemId: "backToDeal"
                }
               ]
        },
        {
            xtype: "label",
            html: "Select a Client Area"
        },
        { 
            xtype: "list",                
            store: "Investors",
            itemId : "InvestorsList",
            onItemDisclosure: true,
            indexBar: false,
            grouped: false,
            disableSelection: false,
            loadingText: "Loading Investors...",
            emptyText: '<div class="leads-list-empty-text">No Investors found.</div>',
             itemCls : "dataview-item",
             itemTpl:[
                '<table border="0" cellpadding="2" cellspacing="2" style="width:95%; margin-top:0px;"><tr>',
                '<td style="width:20%; text-align: center; line-height: 3;  font-size: 16px;">{Account__c}</td>',
                '<td style="width:20%; text-align: center; line-height: 3;  font-size: 16px;">{Primary_Contact_Name__c}</td>',
                '<td style="width:20%; text-align: center; line-height: 3;  font-size: 16px;">{Status__c}</td>',
                '<td style="width:15%; text-align: center; line-height: 3;  font-size: 16px;">{Contact_Phone__c}</td>',
                '<td style="width:20%; text-align: center; line-height: 3;  font-size: 16px;">{Primary_Contact_Email__c}</td>',
                '</tr></table>'
               ],
            listeners : {
                    scope : this,
                    itemtap : function(dataview, index, el, record, e){
                        //Browser event e
                        console.log(e.target,Ext.get(e.target).getAttribute('id'));
                        var formPanel = Ext.create('Ext.form.Panel',{
                             modal : true,
                            hideOnMaskTap : true,
                            centered : true,
                            scrollable : 'vertical',
                            width : 400,
                            height : 200,
                            layout: { type: 'vbox', align: 'stretch' },
                            items:[{
                                xtype: 'selectfield',
                                name: 'Status__c',
                                label: 'Status',
                                options: [ 
                                     {text: 'Pending', value: 'Pending'}, 
                                     {text: 'Accepted', value: 'Accepted'}, 
                                     {text: 'Final Bidder', value: 'Final Bidder'},
                                     {text: 'Dropped', value: 'Dropped'},
                                     {text: 'Rejected', value: 'Rejected'}, 
                                     {text: 'Closed', value: 'Closed'} 
                                 ]
                                 },
                                 {xtype: 'spacer'},
                                 {xtype: 'spacer'},
                                 {
                                    xtype: 'button',
                                    //width : 100,
                                    text: 'Save',
                                    handler: function(){
                                        console.log('Inside Save');
                                        var InvStore = Ext.getStore('Investors');
                                        InvStore.sync();
                                        console.log('Completed Sync');
                                        formPanel.hide();
                                    }
                                 },
                                 {xtype: 'spacer'},
                                 {
                                    xtype: 'button',
                                    text: 'Cancel',
                                    //width : 100,
                                    handler: function(){
                                        formPanel.hide();
                                    }
                                 }]

                        });
                        formPanel.setRecord(record);
                        Ext.Viewport.add(formPanel).show();
                    }
                }

        },
        {
            //xtype: "grid.panel",
            //columns: [
              //  {text: 'Account',  dataIndex:'Account__c'},

            //],

        },
        ],
        listeners: [
        {
            delegate: "#backToDeal",
            event: "tap",
            fn: "onBackDealTap"
        },
        {        
        delegate: "#InvestorsList",
        event: "disclose",
        fn: "onInvestorsListDisclose"
        }
    ]
},'

1 个答案:

答案 0 :(得分:0)

xtype不是grid.panel,只是grid

相关文档链接:http://docs.sencha.com/touch/2.3.1/#!/api/Ext.grid.Grid