ExtJS 前端日期数据格式转化

最新推荐文章于 2020-12-28 19:38:15 发布

凌霜残雪

最新推荐文章于 2020-12-28 19:38:15 发布

阅读量3.4k

点赞数

分类专栏： Ext JS 在VS 中应用文章标签： EXTJS 4.2 日期格式

本文链接：https://blog.csdn.net/qq_21419015/article/details/81333016

版权

Ext JS 在VS 中应用专栏收录该内容

13 篇文章 2 订阅

订阅专栏

本文介绍如何使用ExtJS创建包含日期选择器、全月复选框及查询按钮的工具栏。通过设置监听器实现日期自动填充为每月第一天，并在勾选全月选项时禁用日期选择器的功能。此外，还介绍了如何从前端将日期数据传递到后端进行处理。

摘要由CSDN通过智能技术生成

如下图所示，

ExtJS 代码:

 var tb1 = Ext.create('Ext.toolbar.Toolbar', {
        region: 'north',
        border: '0 0 0 0',
        height: 34
    });
    tb1.add(
        {
            xtype: 'datefield',
            id: 'theDate',
            editable: false,
            labelWidth: 65,
            labelAlign: 'right',
            fieldLabel: '日期',
            width: 180,
            format: 'Y-m-d',
            listeners: {
                render: function (ee) {
                    ee.setValue(Ext.Date.parse(Ext.Date.format(new Date(), 'Y-m') + "-01", 'Y-m-d'));
                }
            }
        },
        {
            xtype: 'checkbox',
            id: 'isWholeMonth',
            hideLabels: true,
            boxLabel: '全月',
            checked: false,
            listeners: {
                change: function (cb, newValue, oldValue, obj) {
                    var theMonth = Ext.getCmp("theDate");
                    theMonth.setDisabled(newValue);
                }
            }
        },       
        '->',
        {
            xtype: 'splitbutton',
            text: '查询',
            width: 70,
            handler: function () {
                btnOKClick();
            },
            menu: [
                      {
                          icon: '../Public/Images/excel.png',
                          text: '导出到Excel',
                          handler: function () {
                              ExportToExcel();
                          }
                      }
            ]
        },
        ' ',
        ' '
    );

将前端日期数据传递到后台：

var timeBegin = Ext.getCmp('theDate').getValue();
var check = Ext.getCmp('isWholeMonth').getValue();
Ext.Ajax.request({
                       url: "EquipmentEnergyInfo.aspx?method=GetOneEquipmentParam",
                       method: 'POST',
                       params: {
                           ariId: theId,
                           typeAriId: tootSelected,
                           timeBegin: Ext.Date.format(timeBegin, 'Y-m-d'),
                           check: check,
                        }
                    });