EXTJS 5.1.1:分页工具栏 - IE8 - 布局运行失败

时间:2015-08-11 09:20:21

标签: javascript extjs layout internet-explorer-8 extjs5

我遇到了EXTJS 5.1.1的分页工具栏的问题,它在IE 8中引发了一个布局运行失败。它在chrome和firefox上工作正常。 当我删除工具栏时,我的网格很好。

这是我的代码:

Ext.define('MyApp.view.overview.List', {
extend: 'Ext.grid.Panel',
alias: 'widget.overviewlist',

requires: [
    'Ext.form.field.ComboBox',
    'Ext.form.field.Date',
    'Ext.button.Button',
    'Ext.grid.column.Action',
    'Ext.grid.View',
    'Ext.grid.column.Date',
    'Ext.form.field.Number',
    'Ext.form.field.TextArea',
    'Ext.toolbar.Paging',
    'Ext.grid.plugin.RowEditing'
],

title: 'KPIs Overview',
titleAlign: 'center',
store: 'Overviews',
itemId: 'overview-grid',
width: 900,
layout:'fit',
height: 650,
dockedItems:
        [
            {
                xtype:'toolbar',
                dock: 'top',
                autoScroll: true,
                itemId  : 'toolbar',
                items   : [
                    {
                        xtype: 'combo',
                        itemId:'unitCombo',
                        fieldLabel: 'Unit',
                        labelWidth: 30,
                        width: 120,
                        margin: '0 0 0 0',
                        store: 'Units',
                        queryMode: 'local',
                        displayField: 'unit',
                        valueField: 'unit'
                    },
                    {
                        xtype: 'combo',
                        itemId: 'rcCombo',
                        fieldLabel: 'RC',
                        labelWidth: 25,
                        width: 115,
                        margin: '0 10 0 10',
                        store: 'Rcs',
                        queryMode: 'local',
                        displayField: 'rc',
                        valueField: 'rc'
                    },
                    {
                        xtype: 'combo',
                        itemId:'appCombo',
                        fieldLabel: 'Application',
                        labelWidth: '50px',
                        margin: '0 10 0 0',
                        store: 'Applications',
                        queryMode: 'local',
                        displayField: 'name',
                        valueField: 'id'
                    },
                    '-',
                    {
                        xtype    : 'datefield',
                        itemId   : 'fromCombo',
                        name     : 'fromCombo',
                        format   : 'F-Y',
                        fieldLabel: 'From',
                        labelWidth: 30,
                        width: 130
                    },
                    {
                        xtype    : 'datefield',
                        itemId   : 'toCombo',
                        name     : 'toCombo',
                        format   : 'F-Y',
                        fieldLabel: 'To',
                        labelWidth: 20,
                        width: 120
                    },
                    {
                        name:'searchButton',
                        itemId:'searchButton',
                        text:'Search'
                    },
                    {
                        name:'resetButton',
                        itemId:'resetButton',
                        text:'Reset'
                    }

                ]
            },
             **{
                xtype: 'pagingtoolbar',
                height: 60,
                pageSize: 12,
                store: 'Overviews',
                items: [
                    {
                        xtype: 'combobox',
                        itemId: 'pagerCombo',
                        width: 120,
                        fieldLabel: 'Nb. rows',
                        labelWidth: 60,
                        editable: false,
                        store: [
                            12,
                            24,
                            36,
                            "All"
                        ]
                    },
                    '->',
                    {
                        xtype: 'button',
                        itemId:'xlsxExport',
                        href: '#',
                        iconCls: 'xlsx-button',
                        scale: 'large',
                        autoWidth: true,
                        autoHeight: true,
                        tooltip:'Export to excel'
                    }
                ]
            }** 
        ],
columns: [

        {
          .......
        },
        {
            xtype: 'gridcolumn',
            ........
        }
    ],

        plugins: [
            {
                ptype: 'rowediting',
                pluginId: 'rowEditor',
                clicksToEdit: 2,
                autoCancel: false
            }
        ]
});

工具栏工作正常,但是分页工具栏不是..! 我尝试使用dock:'bottom',dock:'top'而没有,它在IE上也是一样的错误......

有人能帮助我吗?

0 个答案:

没有答案