Ext.override(Ext.DatePicker, {
onRender : function(container, position) {
var m = [
'<table cellspacing="0">',
'<tr><td class="x-date-left"><a href="#" title="',
this.prevText,
'"> </a></td><td class="x-date-middle" align="center"></td><td class="x-date-right"><a href="#" title="',
this.nextText, '"> </a></td></tr>',
'<tr><td colspan="3"><table class="x-date-inner" cellspacing="0"><thead><tr>'];
var dn = this.dayNames;
for (var i = 0; i < 7; i++) {
var d = this.startDay + i;
if (d > 6) {
d = d - 7;
}
m.push("<th><span>", dn[d].substr(0, 1), "</span></th>");
}
m[m.length] = "</tr></thead><tbody><tr>";
for (var i = 0; i < 42; i++) {
if (i % 7 == 0 && i != 0) {
m[m.length] = "</tr><tr>";
}
m[m.length] = '<td><a href="#" hidefocus="on" class="x-date-date" tabIndex="1"><em><span></span></em></a></td>';
}
m[m.length] = '</tr></tbody></table></td></tr><tr><td colspan="3" class="x-date-bottom" align="center"></td></tr></table><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.eventEl = Ext.get(el.firstChild);
new Ext.util.ClickRepeater(this.el.child("td.x-date-left a"), {
handler : this.showPrevMonth,
scope : this,
preventDefault : true,
stopDefault : true
});
new Ext.util.ClickRepeater(this.el.child("td.x-date-right a"), {
handler : this.showNextMonth,
scope : this,
preventDefault : true,
stopDefault : true
});
this.eventEl.on("mousewheel", this.handleMouseWheel, this);
this.monthPicker = this.el.down('div.x-date-mp');
this.monthPicker.enableDisplayMode('block');
var kn = new Ext.KeyNav(this.eventEl, {
"left" : function(e) {
e.ctrlKey ? this.showPrevMonth() : this.update(this.activeDate
.add("d", -1));
},
"right" : function(e) {
e.ctrlKey ? this.showNextMonth() : this.update(this.activeDate
.add("d", 1));
},
"up" : function(e) {
e.ctrlKey ? this.showNextYear() : this.update(this.activeDate
.add("d", -7));
},
"down" : function(e) {
e.ctrlKey ? this.showPrevYear() : this.update(this.activeDate
.add("d", 7));
},
"pageUp" : function(e) {
this.showNextMonth();
},
"pageDown" : function(e) {
this.showPrevMonth();
},
"enter" : function(e) {
e.stopPropagation();
return true;
},
scope : this
});
this.eventEl.on("click", this.handleDateClick, this, {
delegate : "a.x-date-date"
});
this.eventEl.addKeyListener(Ext.EventObject.SPACE, this.selectToday,
this);
this.el.unselectable();
this.cells = this.el.select("table.x-date-inner tbody td");
this.textNodes = this.el.query("table.x-date-inner tbody span");
this.mbtn = new Ext.Button({
text : " ",
tooltip : this.monthYearText,
renderTo : this.el.child("td.x-date-middle", true)
});
this.mbtn.on('click', this.showMonthPicker, this);
this.mbtn.el.child(this.mbtn.menuClassTarget)
.addClass("x-btn-with-menu");
var today = (new Date()).dateFormat(this.format);
this.todayBtn = new Ext.Button({
renderTo : this.el.child("td.x-date-bottom", true),
text : String.format(this.todayText, today),
tooltip : String.format(this.todayTip, today),
handler : this.selectToday,
scope : this
});
if (Ext.isIE) {
this.el.repaint();
}
this.update(this.value);
//手动触发按钮，显示窗体。
this.mbtn.getEl().dom.click();
},
onMonthClick : function(e, t) {
e.stopEvent();
var el = new Ext.Element(t), pn;
if (el.is('button.x-date-mp-cancel')) {
this.selectToday(this.value); //关闭窗体
} else if (el.is('button.x-date-mp-ok')) {
//设置值
this.value = new Date(this.mpSelYear, this.mpSelMonth,(this.activeDate || this.value).getDate());
//调用值回显的方法，并将选择的值传递过去.最后关闭窗体
this.selectToday(this.value);
// this.update(new Date(this.mpSelYear, this.mpSelMonth, (this.activeDate || this.value).getDate()));
} else if (pn = el.up('td.x-date-mp-month', 2)) {
this.mpMonths.removeClass('x-date-mp-sel');
pn.addClass('x-date-mp-sel');
this.mpSelMonth = pn.dom.xmonth;
} else if (pn = el.up('td.x-date-mp-year', 2)) {
this.mpYears.removeClass('x-date-mp-sel');
pn.addClass('x-date-mp-sel');
this.mpSelYear = pn.dom.xyear;
} else if (el.is('a.x-date-mp-prev')) {
this.updateMPYear(this.mpyear - 10);
} else if (el.is('a.x-date-mp-next')) {
this.updateMPYear(this.mpyear + 10);
}
},
hideMonthPicker : function(disableAnim) {
//去掉这个方法，日期控件就不会显示年/月/日的界面了
/*if (this.monthPicker) {
if (disableAnim === true) {
//this.monthPicker.hide();
} else {
// this.monthPicker.slideOut('t', {duration:.2});
}
}*/
},
selectToday : function(selDate) {
this.setValue(new Date().clearTime());
//这里的日期值从外部传入，更新value
if (selDate != null && selDate != undefined && selDate != "") {
this.setValue(selDate);
}
this.fireEvent("select", this, this.value);
}
})
