zoukankan      html  css  js  c++  java
  • ux.form.field.Month 只能选年、月的时间扩展

    效果如图,亲测6.2.1版本可用,用法同时间选择控件

     1 //月弹窗扩展
     2 //只选月
     3 Ext.define('ux.picker.Month', {
     4     extend: 'Ext.picker.Month',
     5     alias: 'widget.uxMonthpicker',
     6     alternateClassName: 'ux.uxMonthPicker',
     7     afterRender: function () {
     8         var me = this;
     9         //取消监听mousedown事件,否则无法触发事件
    10         me.el.on('mousedown', me.onElClick, me, { translate: false });
    11         me.callParent();
    12 } 13 });
     1 //扩展
     2 //只能选月的时间扩展
     3 Ext.define('ux.form.field.Month', {
     4     extend: 'Ext.form.field.Date',
     5     alias: 'widget.uxMonthfield',
     6     xtype: 'uxMonthfield',
     7     requires: ['ux.picker.Month'],
     8     format: 'Y-m',
     9     selectMonth: new Date(),
    10     createPicker: function () {
    11         var me = this;
    12         return new ux.picker.Month({
    13             value: new Date(),
    14             renderTo: document.body,
    15             floating: true,
    16             hidden: true,
    17             focusOnShow: true,
    18             listeners: {
    19                 scope: me,
    20                 select: me.onSelect,
    21                 cancelclick: me.onCancelClick,
    22                 okclick: me.onOKClick,
    23                 yeardblclick: me.onOKClick,
    24                 monthdblclick: me.onOKClick
    25             }
    26         });
    27     },
    28     onCancelClick: function () {
    29         var me = this;
    30         me.selectMonth = null;
    31         me.collapse();
    32     },
    33     onOKClick: function () {
    34         var me = this;
    35         if (me.selectMonth) {
    36             me.setValue(me.selectMonth);
    37             me.fireEvent('select', me, me.selectMonth);
    38         }
    39         me.collapse();
    40     },
    41     onSelect: function (m, d) {
    42         var me = this;
    43         me.selectMonth = new Date((d[0] + 1) + '/1/' + d[1]);
    44     }
    45 });
  • 相关阅读:
    移动端 细节点
    基于新版 node 的 vue 脚手架搭建
    全屏展示
    Vue 小实例
    移动端 模拟键盘 盖住表单
    decodeURI decodeURIComponent
    简单时钟
    全选 反选 传统写法
    星级点评 面向过程的传统写法
    JQ字符串截取
  • 原文地址:https://www.cnblogs.com/mlzs/p/9444479.html
Copyright © 2011-2022 走看看