Page 1 of 2 12 LastLast
Results 1 to 10 of 32

Thread: EXT4: monthfield with month picker for Extjs4

Hybrid View

Previous Post Previous Post   Next Post Next Post
  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
    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

  4. #4
    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

  5. #5
    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?

  6. #6
    Sencha User maiconschelter's Avatar
    Join Date
    Nov 2008
    Location
    Brazil
    Posts
    15
    Vote Rating
    6
      0  

    Default

    Quote Originally Posted by shawon View Post
    Hey in ExtJS 4.1 RC1 the picker is not showing the "Ok" and "Cancel" button text. Can any one help me on this?
    Found here: http://www.sencha.com/forum/showthre...Field&p=781724

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

    Default

    thanks maiconschelter,
    it resolved the issue.

  8. #8
    Sencha User alexfrg's Avatar
    Join Date
    May 2012
    Posts
    8
    Vote Rating
    0
      0  

    Default

    In this example ( http://ext4all.com/post/ext4-monthfi...ker-for-extjs4 ),you can not selectin February- the dateis reset toMarch
    Thisbugasitdepends on the currentdate (lastnedaleeverything workedOK)

  9. #9
    Sencha User
    Join Date
    Jun 2012
    Posts
    83
    Vote Rating
    3
      0  

    Default

    DELETED
    Last edited by dr-dan; 19 Oct 2012 at 3:42 AM. Reason: didnt see second page

  10. #10
    Sencha Premium Member
    Join Date
    Jan 2008
    Location
    Levittown, PA
    Posts
    326
    Vote Rating
    2
      0  

    Default

    Super helpful. Thank you!

Page 1 of 2 12 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
  •