extjs日期控件使用

Posted zfzf1

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了extjs日期控件使用相关的知识,希望对你有一定的参考价值。

pp.priceApplyQuery.FORMAT_TIME  = ‘Y-m-d H:i:s‘; //格式化时间字符串

  支持 查询,修改,增加

//验证日期
Ext.apply(Ext.form.VTypes, {
    priceApplyQuery_dateRange: function(val, field){ 
        if(field.dateRange){
            var beginId = field.dateRange.begin;
            this.beginField = Ext.getCmp(beginId);
            var endId = field.dateRange.end;
            this.endField = Ext.getCmp(endId);
            beginDate = this.beginField.getValue();
            var endDate = this.endField.getValue();
            var typeName = field.dateRange.type;
        }
        if(beginDate <= endDate){
            if(typeName == "query"){
                  if(new Date(endDate).getTime()-new Date(beginDate).getTime()>3600*1000*24*30){
                        this.priceApplyQuery_dateRangeText = "查询时长不能超过30天!";
                        return false;  
                     }else{
                         return true;  
                     }
            }else if(typeName =="add" || typeName == "update"){
                 var nowDate = new Date();
                if(new Date(beginDate).getTime()<nowDate.getTime()){
                        this.priceApplyQuery_dateRangeText = "启用时间不能小于当前时间!";
                        return false;
                  }else{
                      return true;
                  }
            }else{
               return true;
            }  
        }else{
            this.priceApplyQuery_dateRangeText = "开始时间不能大于结束时间!";
            return false;  
        }
    }
});

  

pp.priceApplyQuery.formatDefaultDate = function(isBegin,format,type) {
    var nowDate = new Date();
    if(isBegin) {
        if(type == "query"){
            nowDate.setHours(0);
            nowDate.setSeconds(0);
            nowDate.setMinutes(0);
        }
    } else {
        nowDate.setHours(23);
        nowDate.setSeconds(59);
        nowDate.setMinutes(59);
    }
    return Ext.Date.format(nowDate,format);
};
{
            xtype:‘datetimefield_date97‘,
            name:‘q_time_beginDate‘, 
            id:‘priceApplyQuery_beginDate_query‘,
            fieldLabel:‘开始‘,
          columnWidth:0.6,
              labelWidth:40,
            format:‘Y-m-d H:i:s‘,
            dateConfig: {
                el: ‘priceApplyQuery_beginDate_query-inputEl‘,
                dateFmt: ‘yyyy-MM-dd HH:mi:ss‘
            },
            editable:false,
            allowBlank:false ,
            time:true,
            value:pp.priceApplyQuery.formatDefaultDate(true,pp.priceApplyQuery.FORMAT_TIME,"query" ),
            dateRange: {begin: ‘priceApplyQuery_beginDate_query‘, end: ‘priceApplyQuery_endDate_query‘,type:‘query‘},  
            vtype: ‘priceApplyQuery_dateRange‘ 

        },{
            xtype:‘datetimefield_date97‘,
            id:‘priceApplyQuery_endDate_query‘,
            name:‘q_time_endDate‘,
           columnWidth:0.6,
            labelWidth:40,
            fieldLabel:‘结束‘,
            format:‘Y-m-d H:i:s‘,
            dateConfig: {
                el: ‘priceApplyQuery_endDate_query-inputEl‘,
                dateFmt: ‘yyyy-MM-dd HH:mi:ss‘
            },
            editable:false,
            allowBlank:false,
            value:pp.priceApplyQuery.formatDefaultDate(false,pp.priceApplyQuery.FORMAT_TIME ,"query" ) ,
            dateRange: {begin: ‘priceApplyQuery_beginDate_query‘, end: ‘priceApplyQuery_endDate_query‘ ,type:‘query‘ },  
            vtype: ‘priceApplyQuery_dateRange‘ 
        }

  

以上是关于extjs日期控件使用的主要内容,如果未能解决你的问题,请参考以下文章

extjs 如何禁用日期时间控件

Extjs 5.x 日期时间控件DateTime源码

EXTJS 6 - 日期控件 Date picker 只选年月

Javascript - ExtJs - GridPanel组件 - 编辑

ExtJS基础知识总结

extjs中的代码优化技术?