Page 1 of 4 123 ... LastLast
Results 1 to 10 of 32

Thread: EXT4: monthfield with month picker for Extjs4

  1. #1
    Ext JS Premium Member
    Join Date
    Jun 2011
    Location
    St. Louis
    Posts
    220
    Vote Rating
    9
      0  

    Default EXT4: monthfield with month picker for Extjs4

    I extend datafield to create monthfield. It will have month picker and display month ( or date - first date of the picked month ).

    PHP Code:
    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'],
        
    selectMonthnull,
        
    createPicker: function() {
            var 
    me this,
                
    format Ext.String.format;
            return 
    Ext.create('Ext.picker.Month', {
                
    pickerFieldme,
                
    ownerCtme.ownerCt,
                
    renderTodocument.body,
                
    floatingtrue,
                
    hiddentrue,
                
    focusOnShowtrue,
                
    minDateme.minValue,
                
    maxDateme.maxValue,
                
    disabledDatesREme.disabledDatesRE,
                
    disabledDatesTextme.disabledDatesText,
                
    disabledDaysme.disabledDays,
                
    disabledDaysTextme.disabledDaysText,
                
    formatme.format,
                
    showTodayme.showToday,
                
    startDayme.startDay,
                
    minTextformat(me.minTextme.formatDate(me.minValue)),
                
    maxTextformat(me.maxTextme.formatDate(me.maxValue)),
                
    listeners: { 
            
    select:        { scopeme,   fnme.onSelect     }, 
            
    monthdblclick: { scopeme,   fnme.onOKClick     },    
            
    yeardblclick:  { scopeme,   fnme.onOKClick     },
            
    OkClick:       { scopeme,   fnme.onOKClick     },    
            
    CancelClick:   { scopeme,   fnme.onCancelClick }        
                },
                
    keyNavConfig: {
                    
    esc: function() {
                        
    me.collapse();
                    }
                }
            });
        },
        
    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'meme.selectMonth);
        }
            
    me.collapse();
        },
        
    onSelect: function(md) {
            var 
    me this;    
        
    me.selectMonth = new Date(( d[0]+) +'/1/'+d[1]);
        }
    }); 
    To use it:
    PHP Code:
          xtype'monthfield',
          
    format'F, Y',  
          
    value: new Date() 

  2. #2
    Sencha User
    Join Date
    May 2007
    Posts
    2
    Vote Rating
    0
      0  

    Default

    Good job guys

  3. #3
    Sencha User
    Join Date
    Jan 2010
    Posts
    37
    Vote Rating
    0
      0  

    Default

    Excellent! Well done! I really appreciate this extension! Thanks a lot!

  4. #4
    Sencha User
    Join Date
    Mar 2010
    Posts
    3
    Vote Rating
    0
      0  

    Thumbs up Perfect

    Thanks a lot

  5. #5
    Sencha Premium User wemerson.januario's Avatar
    Join Date
    Nov 2008
    Location
    Goinia - GO, Brazil
    Posts
    634
    Vote Rating
    49
      0  

    Default

    excelent
    Wemerson Januario
    Site/Blog: http://wemersonjanuario.com.brFrom: Goinia, GO, Brazil
    Consulting Training and Web Development

  6. #6
    Sencha Premium Member
    Join Date
    Feb 2012
    Posts
    4
    Vote Rating
    0
      0  

    Default

    Very useful.

    Thanks.

  7. #7
    Sencha User
    Join Date
    Mar 2012
    Posts
    1
    Vote Rating
    0
      0  

    Default

    The same to you,thanks

  8. #8
    Sencha User
    Join Date
    May 2010
    Location
    Kiev, Ukraine
    Posts
    135
    Vote Rating
    7
      0  

    Default

    Should it submit day=1?
    Demo here http://ext4all.com/post/ext4-monthfi...ker-for-extjs4

  9. #9
    Sencha User
    Join Date
    Apr 2009
    Posts
    10
    Vote Rating
    1
      0  

    Default Localisation issue

    Hi guys,
    Thank you very much for this excellent picker. I use it in an ext js 4 application, which I have localized in the greek language (see the localisation file). I figured out, that the picker without localisation works perfectly. Note that I have chosen the format 'F, Y' for the picker. With the localisation, I pick a month-year, the picker selects the correct month-year, and when I click out of the picker, the year remains correct but the month changes to its original value. Now I use the format 'm/Y' that works. I noticed that
    if I comment out the line: monthNames : Ext.Date.monthNames,
    in the ext-lang-el_GR.js file, it works ok, showing the months in English.
    if(Ext.picker.Date){
    Ext.apply(Ext.picker.Date.prototype, {
    todayText : "??????",
    minText : "? ?????????? ????? ???????????? ??? ??? ?????????? ????????",
    maxText : "? ?????????? ????? ????????????? ??? ??? ??????? ????????",
    disabledDaysText : "",
    disabledDatesText : "",
    monthNames : Ext.Date.monthNames,
    dayNames : Ext.Date.dayNames,
    nextText : '???????? ????? (Control+???? ?????)',
    prevText : '???????????? ????? (Control + ???????? ?????)',
    monthYearText : '??????? ????? (Control + ?????/???? ????? ??? ???????? ????)',
    todayTip : "{0} (??????? ???????????)",
    format : "d/m/y"
    });
    }

    I also tried to change a format of a normal datepicker, to 'F, Y'. That is, I chose a date and the result was ok, (month Year). When I clicked out of the datepicker, the values remained unchanged.
    Thanks in advance,
    Harry

  10. #10
    Sencha User
    Join Date
    Jun 2011
    Posts
    12
    Vote Rating
    0
      0  

    Default

    Hey in ExtJS 4.1 RC1 the picker is not showing the "Ok" and "Cancel" button text. Can any one help me on this?

Page 1 of 4 123 ... LastLast

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •