首页 > 解决方案 > ExtJs Date Picker 显示问题 3.1.0 with Ext.form.DateField

问题描述

我是 ExtJs 的新手,并且对日期选择器的显示有疑问。实际的日期选择器功能有效,但根据所附图片,前 2 列重叠。

我已将日期选择器添加到新的 Ext.FormPanel() 并使用 ExtJs 3.1.0 将面板添加到窗口,如下代码所示:

function save(data) {
    var weekDay = [
                ['1', 'Sunday'],
                ['2', 'Monday'],
                ['3', 'Tuesday'],
                ['4', 'Wednesday'],
                ['5', 'Thursday'],
                ['6', 'Friday'],
                ['6', 'Saturday']
               ];

    var panel = new Ext.FormPanel({
        labelWidth: 125,
        frame:true,
        autoHeight   : true,
        title: 'Create',
        bodyStyle:'padding:5px 5px 0',
        width: 450,
        bodyPadding: 10,
        defaults: {width: 200},
        defaultType: 'textfield',
        items: [
           new Ext.form.ComboBox({
                 fieldLabel: 'Day of the Week (Optional)',
                 id: 'sDay',
                 store: weekDay,
                 typeAhead: true,
                 allowBlank: true,
                 editable: false,
                 selectOnFocus:true,
                 triggerAction: 'all',
                 emptyText:''
             }),
             new Ext.form.DateField({
                 fieldLabel: 'Date',
                 id: 'sDate',
                 format: 'd/m/Y',
                 allowBlank: true,
                 editable: false,
                 minValue: new Date(),
                 emptyText:'',
                 width: 300,
                 style: 'float: left',
                 cls: 'x-border-box, x-border-box',
                 padding: 5,
                 layout: 'form'
            })
        ],

        buttons: [{
            text: 'Save',
            handler: function() {
                // do stuff
                  win.close();
                }

            }
        },{
            text: 'Cancel',
            handler: function() {
                win.close();
            }
        }]
    });

    var win = new Ext.Window({
            title      : 'Save stuff',
            width      : 550,
            autoHeight : true,
            modal      : true,
            border     : false,
            layout     : 'fit',
            items      : panel
        });

        win.show();
}

在此处输入图像描述

我尝试了其他日期格式,增加了宽度,添加了 cls 等但是,没有运气。请问有人遇到过这个ExtJs的问题吗?

标签: javascriptcssextjssencha-architect

解决方案


推荐阅读