重写时间控件，只有选择年月的界面

下面是在ext官方网站上down的一个函数只显示年和月，不显示日
// in the .html
<span id="curMonthDiv">&nbsp;</span>

// in the .js
myApp.app = function() {
    var monthPicker = null;

    return {
        init: function() {

            monthPicker = new Ext.ux.MonthField({
                format:      'M, Y',
                useDayDate:  1,
                noPastYears: true,
                renderTo:    'curMonthDiv',
                monthNames:  [ /* month names... */ ]
            });
            // #1: This works, but still turns the text input gray/doesn't look good
            monthPicker.el.dom.readOnly = true;

            // add listener for when the OK button is clicked (go to new month)
            // #2: doesn't work
            monthPicker.on("select", function(picker, selDate) {
                // go to the new month - contact server...
                // When I select the month and hit the OK btn, this code is not reached
            });

            monthPicker.setValue(new Date()); // today
        } // end init()
    }; // end return
}(); // end myApp.app

----------------------------------------------
下面是我同事扩展的：

Ext.ux.MonthPicker=Ext.extend(Ext.Component,{
format:"M-y",
okText:Ext.DatePicker.prototype.okText,
cancelText:Ext.DatePicker.prototype.cancelText,
constrainToViewport:true,
monthNames:Date.monthNames,
startDay:0,
value:0,
noPastYears:false,
initComponent:function () {
Ext.ux.MonthPicker.superclass.initComponent.call(this);
this.value=this.value?
this.value.clearTime():new Date().clearTime();
this.addEvents(
'select'
);
if(this.handler) {
this.on("select",this.handler,this.scope||this);
}
},
focus:function () {
if(this.el) {
this.update(this.activeDate);
}
},
onRender:function (container,position) {
var m=['<div style="width: 200px; height:175px;"></div>']
m[m.length]='<div class="x-date-mp"></div>';
var el=document.createElement("div");
el.className="x-date-picker";
el.innerHTML=m.join("");
container.dom.insertBefore(el,position);
this.el=Ext.get(el);
this.monthPicker=this.el.down('div.x-date-mp');
this.monthPicker.enableDisplayMode('block');
this.el.unselectable();
this.showMonthPicker();
if(Ext.isIE) {
this.el.repaint();
}
this.update(this