`
niuqiang2008
  • 浏览: 12630 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

Extjs的月份选择器

 
阅读更多

写一个小系统  ,需要选择月份 ,自己写了一个 ,看看有没有更好的解决方法 .

Ext.define('Ext.ux.MyDatePicker', {
    extend: 'Ext.menu.Menu',
    xtype: 'myDatePicker',
    requires: [
        'Ext.picker.Month'
     ],
     
     
    alias: 'widget.mydatepicker',
    initComponent : function(){
        var me = this;

        Ext.apply(me, {
            items: Ext.applyIf({
            	height:'240',
                id: me.pickerId,
                xtype: 'monthpicker',
                listeners: {
                    scope: me,
                    cancelclick:{ fn:me.onCancelClick } ,
                    okclick: {    fn:me.onOkClick },
                    yeardblclick: { fn:me.onOkClick},
                    monthdblclick:{ fn:me.onOkClick }
                }
            },me.initialConfig)
        });

        me.callParent(arguments);

        me.picker = me.down('monthpicker');
        
        me.picker.setValue( Ext.Date.clearTime(new Date()));
    },
    
    onOkClick:function(picker, value){
    	    
       		 this.up().setText(value[1]+'  年 -'+(value[0]+1)+' 月 ');
    	     this.onCancelClick();
    },
    
    onCancelClick:function(){
    	
       Ext.menu.Manager.hideAll();
    },
});

 

调用时就是这样

{
	 text:'选择月份',
	 menu:{
	 xtype: 'mydatepicker',
         plain: true,
 } 

 

分享到:
评论

相关推荐

    extjs年月选择控件

    extjs的年月选择控件,主要针对原有的extjs Datefield控件的基础上增加了插件

    extjs-date-picker:将monthyear选择器添加到Ext JS modern工具包的日期选择器中

    // 创建月份选择器 var monthPicker = Ext.create('Ext.picker.Month', { value: currentMonth, listeners: { select: function(picker, value) { me.setValue(me.value.setMonth(value)); } } }); // ...

    extjs年份控件(只显示年,无月日时分秒)

    Extjs DateField控件 - 只选择年份(找了很久发现网上只有选择年月的控件,于是基于extjs年月控件设计了只选择年份的控件)

    extjs4.2选择两个月的日期控件

    EXTJS 4.2的核心是其强大的组件模型,提供了多种预定义的UI控件,包括日期选择器(Date Picker)。默认的日期选择器只能选择单个日期,但通过自定义扩展(Extension)或UX组件,我们可以实现更复杂的功能,如选择两...

    extjs6.2月份年份控件.rar

    而“月份控件”和“年份控件”则是EXTJS中日期选择器的两个子组件,它们通常被用来增强用户与日期相关的交互体验。 "ext-override.js"这个文件可能是用来对EXTJS的原生组件进行扩展或修改的。在EXTJS中,override...

    ext3.0-月份,年份选择框

    "ext3.0-月份,年份选择框"是一个专为EXTJS 3.0框架设计的特定组件,用于帮助用户在界面上方便地选择月份和年份。EXTJS是一个强大的JavaScript应用程序框架,它提供了丰富的UI组件和数据绑定机制,使得开发者可以快速...

    extjs扩展年度控件,EXTJS里的时间控件的年度重写

    2. **隐藏不必要的部分**:由于目标是只选择年份,所以需要隐藏或者禁用原始日期选择器中的月份和日期选择部分。这可以通过修改模板或者设置配置项来实现。 3. **年份选择器**:设计一个年份选择的界面,可以是下拉...

    Extjs 年月日时分秒组件

    在ExtJS中,开发人员可以利用其丰富的组件库来创建各种用户界面元素,包括日期选择器。"Extjs 年月日时分秒组件"是一个特定的插件,允许用户在应用程序中选择精确到时分秒的时间。这种组件对于需要用户输入特定时间...

    EXTJS 自定义月选择控件

    monthNames:数组,月份显示名称,每个月只有前三位有效,默认["一月","二月",……,"十二月"] minYear:可以选定最小年,默认1970 minYearText:未通过最小年份验证时提示文本,默认"minYearNow" maxYear:可以选择的...

    EXTJS升级版时间控件

    这个“EXTJS升级版时间控件”是一个增强型的时间选择器,它扩展了EXTJS原有的日期字段(`Ext.form.DateField`)功能,增加了更多的选项来满足用户在日期选择上的需求。 该控件的核心功能是在原有的时间选择基础上,...

    ext6中年份选择控件亲测好用

    使用EXT6的YearField,开发者可以轻松地在应用中添加一个年份选择器。以下是一些关于YearField的关键知识点: 1. **创建YearField**: 通过EXT的构造函数,我们可以创建一个新的YearField实例,设置其属性如初始值、...

    Extjs控件属性(详细版)

    - **maxValue**:设置时间选择器中允许的最大时间值。例如,`"23:59"`。 - **maxText**:当用户输入的时间值超过最大值时显示的错误提示信息。例如,`"时间不能超过23:59"`。 - **minValue**:设置时间选择器中允许...

    Ext DateField控件 - 只选择年月

    开发者可能通过重写或者添加特定的配置,使得原本的DateField控件在弹出的日历选择器中只显示年和月,而隐藏或者禁用日的选择。这通常涉及到对控件的模板、事件监听器以及选择器逻辑的调整。 源码分析方面,`...

    ext4.2 日历日期控件,可以选择时分秒

    EXTJS 4.2是一个稳定且功能强大的版本,提供了多种UI组件和工具,包括日期时间选择器。这个日历控件不仅提供标准的日期选择功能,还扩展到了小时、分钟和秒钟的精细化选择,使得用户能够精确设定时间,这对于需要...

    Ext2的日期组件只选择年月

    `DatePicker` 是一个用于显示日期选择器的组件,而 `DateField` 可能是与之相关的文本输入字段,允许用户输入或选择日期。在Ext2中,这两个组件可能被用来实现年月选择的功能。 在深入探讨之前,我们需要了解ExtJS...

    extjs4图表绘制之折线图实现方法分析

    本实例主要讲解如何利用EXTJS4的图表功能来实现动态数据的折线图展示,包括从后端获取数据并展示在图表上,以及查询每年各个月份的人数。 首先,我们定义一个名为`ChartLineTest`的类,它继承自`Ext.panel.Panel`,...

    ext 可以选择小时分钟秒

    `DateTimeField` 提供了一个完整的日期时间选择器,用户可以在同一个界面上方便地选择日期和时间,这对于需要精确到时间点的应用场景非常有用。 使用`DateTimeField`,开发者通常需要做以下几步配置: 1. 引入相关...

    ext4 年月时间控件 年月日时间控件 年月日时分秒时间控件

    2. **年月选择器**:这种控件允许用户仅选择年份和月份,通常适用于只需要知道大致日期的情况,例如统计数据的筛选或者周期性事件的设定。 3. **年月日选择器**:比年月选择更进一步,用户可以选择具体的日期。这种...

    基于Ext2的日历控件和IP地址输入控件

    在EXTJS中,日历控件通常通过组合多个组件来实现,如日期选择器(DateField)和面板(Panel)。日历控件允许用户选择日期或日期范围,常见于事件管理、预订系统等应用场景。EXTJS 2.2中的日历控件可能需要开发者手动...

    Ext扩展dateField时间控件,可以选择年月日、年月、年、月

    4. **事件处理**:扩展可能包含额外的事件监听器,以便在用户切换选择模式或选择日期时触发特定的操作,如更新关联的数据显示或者执行后台数据验证。 5. **样式和主题**:为了提高用户体验,扩展可能会对日历组件的...

Global site tag (gtag.js) - Google Analytics