如何在卡布局中在卡之间切换

时间:2019-07-10 09:35:41

标签: extjs

我有一张卡片布局,其中有两张卡片,其中一个带有选项卡面板。里面有选项卡面板的网格面板,另一个是我的内容面板。我必须切换到下一张卡片,即,在单元格上的内容面板上单击网格面板上的

使用了setActiveitem()函数,但是出了点问题。

extend: Ext.panel.Panel,
id: 'cardpanel',
width: 300,
height: 1000,
reference: 'resultcardPanel',
itemid: 'cardPanel',
layout: {
    type: 'card',
    anchor: '100%'
},
activeItem: 0,
xtype: 'searchresults',
bodyStyle: 'padding:15px',
defaults: {

    border: false
},
controller: 'email',

viewModel: {
    type: 'email'
},


items: [{
        xtype: 'tabpanel',
        //id:'searchresults',

        requires: [
            'Ext.grid.Panel',
            'Ext.toolbar.Paging',
            'Ext.grid.column.Date'
        ],


        cls: 'shadow',
        activeTab: 0,
        margin: 20,
        ///////////////////////////////////////////////////////
        items: [{
                xtype: 'grid',
                cls: 'allRecordsCls',
                scrollable: false,

                border: false,
                title: 'Primary',
                routeId: 'inbox',
                bind: '{inbox}',

                itemclick: function() {
                    centerpanel = new Ext.Panel({
                        layout: 'card',

                        items: [homepanel, browser.grid]
                    });

                    centerpanel.getLayout().setActiveItem(1);
                },
                selModel: {
                    selType: 'checkboxmodel',
                    checkOnly: true,
                    showHeaderCheckbox: true
                },

                headerBorders: false,
                rowLines: false,
                scrollable: false,

                listeners: {
                    itemclick: 'onGridCellItemClick2'
                },

                columns: [


                    {
                        dataIndex: 'from',
                        text: 'From',
                        width: 140,


                    },
                    {
                        dataIndex: 'title',
                        text: 'Subject',
                        flex: 1,

                    },


                    {
                        xtype: 'datecolumn',
                        dataIndex: 'received_on',
                        width: 90,
                        text: 'Received On'
                    }
                ],


            },
            //////////////////////////////////////////////////////////
            {
                xtype: 'grid',
                cls: 'allRecordsCls',
                scrollable: false,

                border: false,
                title: 'Social',
                routeId: 'inbox',
                bind: '{inbox}',

                listeners: {
                    itemclick: 'clickme'
                },

                selModel: {
                    selType: 'checkboxmodel',
                    checkOnly: true,
                    showHeaderCheckbox: true
                },

                headerBorders: false,
                rowLines: false,
                scrollable: false,

                columns: [


                    {
                        dataIndex: 'from',
                        text: 'From',
                        width: 140,


                    },
                    {
                        dataIndex: 'title',
                        text: 'Subject',
                        flex: 1,

                    },


                    {
                        xtype: 'datecolumn',
                        dataIndex: 'received_on',
                        width: 90,
                        text: 'Received On'
                    }
                ],
            },
            ///////////////////////////////////////////////////////
            {
                xtype: 'grid',
                cls: 'allRecordsCls',
                scrollable: false,

                border: false,
                title: 'Promotion',
                routeId: 'inbox',
                bind: '{inbox}',

                selModel: {
                    selType: 'checkboxmodel',
                    checkOnly: true,
                    showHeaderCheckbox: true
                },

                listeners: {
                    itemclick: 'onGridCellItemClick2'
                },

                headerBorders: false,
                rowLines: false,
                scrollable: false,

                columns: [


                    {
                        dataIndex: 'from',
                        text: 'From',
                        width: 140,


                    },
                    {
                        dataIndex: 'title',
                        text: 'Subject',
                        flex: 1,

                    },


                    {
                        xtype: 'datecolumn',
                        dataIndex: 'received_on',
                        width: 90,
                        text: 'Received On'
                    }
                ],
            },
        ],
    },

    ///////////////////////////////////////////
    {
        id: 'cardPanel',
        xtype: 'emaildetails'
    },
]

要在控制器中声明的“ onGridCellItemClick2”中写入什么功能

0 个答案:

没有答案