1、注册xtype类型

2、保存文件为xxxx.js

3、使用 xtype : monthfield

   return this.buildToolbar({
items: [
{ xtype: 'monthfield', cId: 'dfBeginDate', labelWidth: 40, width: 150, format: 'Y-m', fieldLabel: '日期' },
{ xtype: 'monthfield', cId: 'dfEndDate', labelWidth: 20, width: 125, format: 'Y-m', fieldLabel: '至' },
{ cId: 'btnSearch', text: "查询", operationName: 'Search' }
]
});

4、效果

  

-------------------------------------------------------------------

Ext.define('Ext.form.field.Month', {
extend: 'Ext.form.field.Date',
alias: 'widget.monthfield',
requires: ['Ext.picker.Month'],
alternateClassName: ['Ext.form.MonthField', 'Ext.form.Month'],
selectMonth: null,
createPicker: function () {
var me = this,
format = Ext.String.format,
pickerConfig;
pickerConfig = {
pickerField: me,
ownerCmp: me,
renderTo: document.body,
floating: true,
hidden: true,
focusOnShow: true,
minDate: me.minValue,
maxDate: me.maxValue,
disabledDatesRE: me.disabledDatesRE,
disabledDatesText: me.disabledDatesText,
disabledDays: me.disabledDays,
disabledDaysText: me.disabledDaysText,
format: me.format,
showToday: me.showToday,
startDay: me.startDay,
minText: format(me.minText, me.formatDate(me.minValue)),
maxText: format(me.maxText, me.formatDate(me.maxValue)),
listeners: {
select: { scope: me, fn: me.onSelect },
monthdblclick: { scope: me, fn: me.onOKClick },
yeardblclick: { scope: me, fn: me.onOKClick },
OkClick: { scope: me, fn: me.onOKClick },
CancelClick: { scope: me, fn: me.onCancelClick }
},
keyNavConfig: {
esc: function () {
me.collapse();
}
}
};
if (Ext.isChrome) {
me.originalCollapse = me.collapse;
pickerConfig.listeners.boxready = {
fn: function () {
this.picker.el.on({
mousedown: function () {
this.collapse = Ext.emptyFn;
},
mouseup: function () {
this.collapse = this.originalCollapse;
},
scope: this
});
},
scope: me,
single: true
}
}
return Ext.create('Ext.picker.Month', pickerConfig);
},
onCancelClick: function () {
var me = this;
me.selectMonth = null;
me.collapse();
},
onOKClick: function () {
var me = this;
if (me.selectMonth) {
me.setValue(me.selectMonth);
me.fireEvent('select', me, me.selectMonth);
}
me.collapse();
},
onSelect: function (m, d) {
var me = this;
me.selectMonth = new Date((d[0] + 1) + '/1/' + d[1]);
}
});

Ext5.1日期控件仅显示年月的更多相关文章

  1. zui框架配置日期控件只显示年月

    zui框架配置日期控件datetimepicker只显示年月 <!DOCTYPE html> <head> <script src="~/Scripts/jqu ...

  2. ExtJs4.0日期控件只显示年月按年月格式会跳月的解决办法

    如果是Ext.form.panel的话,只要设置一下属性就可以.如下代码: { text : '期间', width : 80, sortable : true, dataIndex : 'accou ...

  3. WPF DatePicker日期控件只显示年月

    1.需要引用2个类,第一个类DatePickerCalendar public class DatePickerCalendar { public static readonly Dependency ...

  4. js 日期控件 可以显示为和历

    日期控件的js <!-- /** * Calendar * @param beginYear 1990 * @param endYear 2010 * @param language 0(zh_ ...

  5. 转 EasyUi日期控件datebox设置,只显示年月,也只能选择年月

    1.引入Jquery和easyui,注低版本的Jquery和easy不能使用,这里使用的Jquery是1.8.2easyui是1.6.1.1.easyui下载地址:http://www.jeasyui ...

  6. jQuery里面的datepicker日期控件默认是显示英文的,如何显示中文或其他语言呢?

    jQuery里面的datepicker日期控件默认是显示英文的,如何让他显示中文或其他呢? [官方的写法]: (1)引入JS文件: <script type="text/javascr ...

  7. JGUI源码:实现日期控件显示(17)

    本文实现一个日期控件显示,日期控件看起来很复杂,其实原理很简单,大部分情况下我们直接使用别人做得好的日期控件就行,但有时候特殊需求,比如显示提醒之类的,恐怕第三方控件就不好实现了, 为了使程序逻辑看起 ...

  8. 关于JSON日期格式显示及My97日期控件

    1.My97日期控件.显示不同的日期格式,可以调整"dateFmt“的参数来配置: 详细DEMO:http://www.my97.net/demo/index.htm <p>日期 ...

  9. my97日期控件弹出位置显示异常

    使用my97日期选择控件的时候,如果整个页面是有滚动条的,根据触发显示日期的控件的父控件的position不同会显示不同的情况 1.position不为fixed则滑动滚动条,显示的日期层不会出现异常 ...

随机推荐

  1. 【u240】棋子放置

    Time Limit: 1 second Memory Limit: 128 MB 小虎刚刚上了幼儿园,老师让他做一个家庭作业:首先画3行格子,第一行有三个格子,第二行有2个格子,第三行有1个格子. ...

  2. python 多线程拷贝单个文件

    # -*- coding: utf-8 -*- # @author: Tele # @Time : 2019/04/04 下午 12:25 # 多线程方式拷贝单个文件 import threading ...

  3. BZOJ 1260 - 区间dp

    Magic Door 题目大意: 给一个字符串,问需要至少覆盖多少次. 题目分析 区间dp: dp[i][j]表示达到i~j这个状态的最少覆盖次数,分两种情况: s[i] == s[j]: 此时内层可 ...

  4. 修改NuGet packages目录路径

    在*.sln文件同目录下新建配置文件nuget.config,内容为 <?xml version="1.0" encoding="utf-8"?> ...

  5. Java 中StringBuffer与StringBuilder区别(转)及String类的一些基本操作代码

    String 字符串常量StringBuffer 字符串变量(线程安全)  多个线程访问时,不会产生问题(Synchronized)StringBuilder 字符串变量(非线程安全) 多个线程访问时 ...

  6. ASCII码(转)

    ASCII(American Standard Code for Information Interchange,美国标准信息交换代码)是基于拉丁字母的一套电脑编码系统,主要用于显示现代英语和其他西欧 ...

  7. RStudio 的使用

    0. 基本 路径查看和设置: getwd() ⇒ 查看路径 setwd() ⇒ 设置路径: 1. 快捷键 ctrl+shift+c:多行注释:选中待注释的代码段,按下 ctrl+shift+c(c 表 ...

  8. 聊聊QPS/TPS/并发量/系统吞吐量的概念

    原文:聊聊QPS/TPS/并发量/系统吞吐量的概念 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/cainiao_user/article/deta ...

  9. Android GPS获取当前位置信息

    package com.example.gpstest; import org.apache.http.util.LangUtils; import android.content.Context; ...

  10. Spring MVC【入门】一篇!

    MVC 设计概述 在早期 Java Web 的开发中,统一把显示层.控制层.数据层的操作全部交给 JSP 或者 JavaBean 来进行处理,我们称之为 Model1:     出现的弊端: JSP ...