javascript - Extjs日期选择器显示问题

我为日期选择器编写了ExtJS代码，并将其包含在两个不同的HTML文件中。第一个HTML文件中文本框的高度与另一个不同。我的代码是：

Ext.create('Ext.form.Panel', {
    height: '15%',
    width: $("#MainWindow_Right_Panel").width() - 20,
    renderTo: 'FilterControl',
    id: 'DatePicker_Panel',
    border: 0,
    items: [
        {
            xtype: 'datefield',
            fieldLabel: 'To',
            name: 'to_date',
            style: 'float: right',
            id: 'todate',
            padding: 5,
            width: 130,
            labelWidth: 30,
            value: todate,
            maxValue: today,
            format: "d.m.Y",
            layout: 'form',
            listeners: {
                select: function(combo, value) {
                     todate=value;

                }
            }
        },
        {
            xtype: 'datefield',
            fieldLabel: 'From',
            style: 'float: right',
            labelWidth: 50,
            width: 150,
            name: '_fromdate',
            padding: 5,
            id: 'fromdate',
            value:fromdate,
            maxValue: today,
            format: "d.m.Y",
            layout: 'form',
            listeners: {
                select: function(combo, value) {
                   fromdate=value;
                }
            }

        },
    ]
});

在第一个HTML中输出：
在第二种情况下：

最佳答案

必须添加cls:'x-border-box，x-border-box'，
添加cls后，您的代码应如下所示：

 Ext.create('Ext.form.Panel', {
    height: '15%',
    width: $("#MainWindow_Right_Panel").width() - 20,
    renderTo: 'FilterControl',
    id: 'DatePicker_Panel',
    border: 0,
    items: [
        {
            xtype: 'datefield',
            fieldLabel: 'To',
            name: 'to_date',
            style: 'float: right',
            **cls:'x-border-box, x-border-box',**
            id: 'todate',
            padding: 5,
            width: 130,
            labelWidth: 30,
            value: todate,
            maxValue: today,
            format: "d.m.Y",
            layout: 'form',
            listeners: {
                select: function(combo, value) {
                     todate=value;

                }
            }
        },
        {
            xtype: 'datefield',
            fieldLabel: 'From',
            style: 'float: right',
            **cls:'x-border-box, x-border-box',**
            labelWidth: 50,
            width: 150,
            name: '_fromdate',
            padding: 5,
            id: 'fromdate',
            value:fromdate,
            maxValue: today,
            format: "d.m.Y",
            layout: 'form',
            listeners: {
                select: function(combo, value) {
                   fromdate=value;
                }
            }

        },
    ]
});

关于javascript - Extjs日期选择器显示问题，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/18695427/