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. NOIP模拟 run - 双向链表

    题目大意: 企鹅国正在举办全面运动会,第一项比赛就是跑步.N 个人在圆形跑道上跑步,他们都有各自的速度和起点.但这个跑步规则很奇怪,当两个人相遇的时候编号较小的就会出局,当场上剩下最后一个人的时候跑步 ...

  2. Access control differentiation in trusted computer system

    A trusted computer system that offers Linux® compatibility and supports contemporary hardware speeds ...

  3. Linux下安装mysql(1)(CentOS)

    标题是(1)也就是说这次是基础安装,这种方式安装,没有组的创建,权限管理,配置文件更改等,仅仅是最基本的安装,适合第一次在linux上安装mysql的新手 1.准备好安装包(Linux-Generic ...

  4. word 论文排版 —— 按指定格式章节的自动编号

    在word中如何实现章节标题自动编号 标题样式与标题的编号是两个步骤,为标题建立编号是在为标题样式确定的基础后进行的.这是显而易见的,也即只有先定义了多级标题(也可使用 word 自带的标题样式),才 ...

  5. 简单的记录一下JavaScript 高级应用

    我是一名.net 程序员但是由于公司需求,开发离线app,但是在工作的过程中我发现,周围人在写JavaScript的时候都是面向过程的编码,对于我这.net程序员,遇到这种情况真是六神无主,但是工作中 ...

  6. Failed during checkstyle execution: Unable to find suppressions file at location: src/checkstyle/checkstyle-suppressions.xml

    <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot ...

  7. Java SpringMVC实现国际化整合案例分析(i18n) 专题

    所谓国际化就是支持多种语言,web应用在不同的浏览环境中可以显示出不同的语言,比如说汉语.英语等.下面我将以具体的实例来举例说明: (1)新建动态Javaweb项目,并导入几个SpringMVC必需的 ...

  8. PHP中遍历关联数组的方法

    下面介绍PHP中遍历关联数组的三种方法:foreach <?php $sports = array( 'football' => 'good', 'swimming' => 'ver ...

  9. 解析Android的 消息传递机制Handler

    1. 什么是Handler: Handler 网络释义"机械手.经理"意思,在Android它用于管理多个线程UI操作: 2. 为什么会出现Handler: 在Android里面的 ...

  10. Expression Design与Blend制作滚动的小球动画教程

    原文:Expression Design与Blend制作滚动的小球动画教程 一,开发工具 Microsoft Expression Design & Blend 4.0 (3.0亦可). 这两 ...