datetime.js

1.. 需要jdom.jar和bsf.jar,否则无法跟spring整合. 2.. dwr生成的javascript函数会自动加一个回调函数的参数,如原来的函数是checkExist(String

/********** CONSTRUCTOR ******
 * Parameters: as per Ext.DatePicker
 ****/
DatetimePicker = function(config){
	/** Call superclass constructor **/
	DatetimePicker.superclass.constructor.call(this, config);
};

Ext.extend(DatetimePicker, Ext.DatePicker, {

	/**
	* Method Name: onRender
	* Description: as per Ext.DatePicker's onRender, except renders year in its own cell with arrow-changers in additional columns
	* Parameters: as per Ext.DatePicker's onRender
	* Returns: n/a
	* Throws: n/a
	*/
    selectToday : function(){
        this.setValue(new Date().clearTime());
		var val1 = this.value;
		val1.setHours(this.theHours);
		val1.setMinutes(this.theMinutes);
        this.fireEvent("select", this, val1);
    },
    handleDateClick : function(e, t){
        e.stopEvent();
        if(t.dateValue && !Ext.fly(t.parentNode).hasClass("x-date-disabled")){
            this.setValue(new Date(t.dateValue));
			var val1 = this.value;
			val1.setHours(this.theHours);
			val1.setMinutes(this.theMinutes);
            this.fireEvent("select", this, val1);
        }
    },
 	onRender : function(container, position){
        var m = [
             '<table cellspacing="0">',
                '<tr><td colspan="3"><table cellspacing="0" width="100%"><tr><td class="x-date-left"><a href="#" title="', this.prevText ,'">&#160;</a></td><td class="x-date-middle" align="center"></td><td class="x-date-right"><a href="#" title="', this.nextText ,'">&#160;</a></td></tr></table></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(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 class="minutecss"><table cellspacing="0" ><tr>';
		m[m.length] = '<td class="y-hour-left"><a href="#" title="down"> </a></td><td class="y-hour-middle" align="center"></td><td class="y-hour-right"><a href="#" title="up"> </a></td>';
		m[m.length] = '<td class="y-minute-left"><a href="#" title="down"> </a></td><td class="y-minute-middle" align="center"></td><td class="y-minute-right"><a href="#" title="up"> </a></td>';
		m[m.length] = '</tr></table></td><td  colspan="2" 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
        });
		new Ext.util.ClickRepeater(this.el.child("td.y-hour-left a"), {
																			handler: function(){
																				if(this.theHours>0){
																					this.theHours--;
																					this.theHours = this.theHours %24;
																					var txt = '';
																					if(this.theHours<10){
																						txt='0'+this.theHours;
																					}
																					else{
																						txt= this.theHours;
																					}
																					this.hourLabel.update(txt+'时');
																					
																				}
																			}.createDelegate(this), 
																			scope: this
																		});
		new Ext.util.ClickRepeater(this.el.child("td.y-hour-right a"), {
																			handler: function(){
																				this.theHours++;
																				this.theHours = this.theHours % 24;
																				var txt = '';
																				if(this.theHours<10){
																					txt='0'+this.theHours;
																				}
																				else{
																					txt= this.theHours;
																				}
																				this.hourLabel.update(txt+'时');
																			}.createDelegate(this), 
																			scope: this
																		});
		new Ext.util.ClickRepeater(this.el.child("td.y-minute-left a"), {
																			handler: function(){
																				if(this.theMinutes>0){
																					this.theMinutes--;
																					this.theMinutes = this.theMinutes % 60;
																					var txt = '';
																					if(this.theMinutes<10){
																						txt='0'+this.theMinutes;
																					}
																					else{
																						txt= this.theMinutes;
																					}
																					this.minuteLabel.update(txt+'分');
																					
																				}
																			}.createDelegate(this), 
																			scope: this
																		});
		new Ext.util.ClickRepeater(this.el.child("td.y-minute-right a"), {
																			handler: function(){
																				this.theMinutes++;
																				this.theMinutes = this.theMinutes % 60;
																				var txt = '';
																				if(this.theMinutes<10){
																					txt='0'+this.theMinutes;
																				}
																				else{
																					txt= this.theMinutes;
																				}	
																				this.minuteLabel.update(txt+'分');
																			}.createDelegate(this), 
																			scope: this
																		});

        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: "&#160;",
            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 dt1 = new Date();
		var txt = '';
		this.hourLabel = this.el.child("td.y-hour-middle");
		this.theHours = dt1.getHours();
		if(this.theHours<10){
			txt='0'+this.theHours;
		}
		else{
			txt= this.theHours;
		}	
		this.hourLabel.update(txt+'时');

		this.minuteLabel = this.el.child("td.y-minute-middle");
		this.theMinutes = dt1.getMinutes();
		if(this.theMinutes<10){
			txt='0'+this.theMinutes;
		}
		else{
			txt= this.theMinutes;
		}	
		this.minuteLabel.update(txt+'分');