Ext5.1日期控件仅显示年月
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日期控件仅显示年月的更多相关文章
- zui框架配置日期控件只显示年月
zui框架配置日期控件datetimepicker只显示年月 <!DOCTYPE html> <head> <script src="~/Scripts/jqu ...
- ExtJs4.0日期控件只显示年月按年月格式会跳月的解决办法
如果是Ext.form.panel的话,只要设置一下属性就可以.如下代码: { text : '期间', width : 80, sortable : true, dataIndex : 'accou ...
- WPF DatePicker日期控件只显示年月
1.需要引用2个类,第一个类DatePickerCalendar public class DatePickerCalendar { public static readonly Dependency ...
- js 日期控件 可以显示为和历
日期控件的js <!-- /** * Calendar * @param beginYear 1990 * @param endYear 2010 * @param language 0(zh_ ...
- 转 EasyUi日期控件datebox设置,只显示年月,也只能选择年月
1.引入Jquery和easyui,注低版本的Jquery和easy不能使用,这里使用的Jquery是1.8.2easyui是1.6.1.1.easyui下载地址:http://www.jeasyui ...
- jQuery里面的datepicker日期控件默认是显示英文的,如何显示中文或其他语言呢?
jQuery里面的datepicker日期控件默认是显示英文的,如何让他显示中文或其他呢? [官方的写法]: (1)引入JS文件: <script type="text/javascr ...
- JGUI源码:实现日期控件显示(17)
本文实现一个日期控件显示,日期控件看起来很复杂,其实原理很简单,大部分情况下我们直接使用别人做得好的日期控件就行,但有时候特殊需求,比如显示提醒之类的,恐怕第三方控件就不好实现了, 为了使程序逻辑看起 ...
- 关于JSON日期格式显示及My97日期控件
1.My97日期控件.显示不同的日期格式,可以调整"dateFmt“的参数来配置: 详细DEMO:http://www.my97.net/demo/index.htm <p>日期 ...
- my97日期控件弹出位置显示异常
使用my97日期选择控件的时候,如果整个页面是有滚动条的,根据触发显示日期的控件的父控件的position不同会显示不同的情况 1.position不为fixed则滑动滚动条,显示的日期层不会出现异常 ...
随机推荐
- js实现表格配对小游戏
js实现表格配对小游戏 一.总结 一句话总结: 二.js实现表格配对 1.配对游戏案例说明 实例描述: 当用户点击两个相同的图案或字符后配对成功,全部配对成功后游戏获胜 案例008采用了大家常见的小游 ...
- Linux初接触设置笔记01
没事装Linux尝试一下,来来回回装无数次,把刚开始需要设置的东西自己收藏一下,针对Centos7 装完Centos默认会覆盖windows引导,所以首先要做的是恢复windows的引导,如果不恢复, ...
- struts2_11_实现自己的拦截器的定义
1)登录界面代码: <% //设置session的值keyword为user request.getSession().setAttribute("user", " ...
- URAL 1684. Jack's Last Word KMP
题目来源:URAL 1684. Jack's Last Word 题意:输入a b 把b分成若干段 每一段都是a的前缀 思路:b为主串 然后用a匹配b 记录到b的i位置最大匹配的长度 然后切割 切割的 ...
- OVS 派OFPT_PORT_STATUS 流程
依据openflow合约[OFP1.0-38],当从物理端口ovs datapath 添加,改动或者删除的时候.都会先运行详细动作.然后通过ofp_port_status异步消息告知Controlle ...
- numpy 维度与轴的问题
0. 多维数组的显示问题 >> X = np.reshape(np.arange(24), (2, 3, 4)) # 也即 2 行 3 列的 4 个平面(plane) >> X ...
- qt的应用层主要是大型3d,vr,管理软件和器械嵌入软件(有上千个下一代软件黑科技项目是qt的,美国宇航局,欧洲宇航局,超级战舰DDG1000)
作者:Nebula.Trek链接:https://www.zhihu.com/question/24316868/answer/118944490来源:知乎著作权归作者所有.商业转载请联系作者获得授权 ...
- Openstack+Kubernetes+Docker微服务实践
Openstack+Kubernetes+Docker微服务实践 ..... Openstack+Kubernetes+Docker微服务实践之路--选型 posted @ 2016-11-15 ...
- EPI_H/EPI_V(边缘保持指数,matlab 矢量化编程)
EPI: edge preservation index,衡量对原始图像的操作(目标图像)对图像边缘的保持能力. EPI_H:horizontal ,水平方向: EPI_V:vertical,垂直方向 ...
- Python 的神奇方法指南
简介 有关 Python 内编写类的各种技巧和方法(构建和初始化.重载操作符.类描述.属性访问控制.自定义序列.反射机制.可调用对象.上下文管理.构建描述符对象.Pickling). 你可以把它当作一 ...