Rewrite Dhtmlxgrid's calender

Source: Internet
Author: User
Tags tostring

Author: Rautinee
email:rautinee@yahoo.com.cn Keywords: UI dhtmlxgrid
Dhtmlxgrid was a good thing I found on Javaeye, and decided to introduce Dhtmlxgrid into our project, but when we looked at the calender section, we found the 1.2 standard version of the problem, which is when you choose a date, Click on the small icon over the month, the date selection interface will disappear. But the Pro version of 1.0 doesn't have this problem, I looked at the code, this should be with the process of the detach deal with that piece, but Dhtmlxgrid code too long, see I was dizzy, leg cramps, a few changes have not succeeded, had to think about what Heterodoxy can replace his function.

The date selection component in my original project is popcalender.js, familiar to him from his hands, the revised scheme is as follows: Discard the Yahoo UI calender components, use Popcalender to replace, need to change Dhtmlxgrid_excell _calender.js and Popcalender.js these two documents. In the original code, the author should be by calling detach to achieve the value of the cell, but calender has a special, is that he needs to work over the month, and according to my observation, after double-clicking the call out date selection interface, just click the mouse, that is, call the detach, execute the code inside, That's why clicking the rollover button, the selection screen closes, and detach only executes once. The solution I'm using is to modify the Closecalender function in the pop, which is called when the user chooses the date, and the cell in which the current operation is assigned, so the problem is solved.

Watch Dhtmlxgrid_excell_calender.js first.

JS Code
/*
Copyright Scand LLC http://www.scbr.com
This version of Software are free for using in the GNU GPL applications. For a or to get
Professional Edition info@scbr.com to obtain license
*/

function Excell_calendar (cell) {
try{
This.cell = cell;
This.grid = This.cell.parentNode.grid;
}catch (er) {}
This.edit = function () {
var arpos = this.grid.getPosition (This.cell);
Popupcalendar (This.cell, This.cell, "Yyyy-mm-dd", -1,-1);
This.cell._cediton=true;
This.val=this.cell.val;

}
This.getvalue = function () {
if (this.cell.val) return this.cell.val;
Return this.cell.innerHTML.toString (). _dhx_trim ()
}


}
Excell_calendar.prototype = new EXcell;
EXcell_calendar.prototype.setValue = function (val) {


if (!val | | val.tostring (). _dhx_trim () = = "") val= "";

This.cell.val=val.tostring ();
if (this.cell.val== "NaN") {
This.cell.val= "";
This.cell.innerhtml= "";

}
else if (this.cell.val== "")
{
This.cell.val= "";
This.cell.innerhtml= "";

}
Else
{
This.cell.innerHTML = This.cell.val;
}

}

In Popcalender, the main is to modify the function of Closecalender, add two pieces of code inside him:

JS Code

Ctltoplacevalue in this place is the cell in the grid.
Ctltoplacevalue.val = Constructdate (dateselected,monthselected,yearselected);
ctltoplacevalue.innerhtml = Ctltoplacevalue.val;

And in the Popupcalendar function, in the

Crossobj.left = Fixedx==-1? Ctl.offsetleft + Leftpos:fixedx

Add a word to the front

JS Code

leftpos<0?leftpos=0:leftpos=leftpos;

Ok,get it!

IE6 and firefox1.5 test pass, the revised code I packed, I hope to be able to use Dhtmlxgrid friends to provide some help, examples can see the Samples directory of the duplicate calendar_grid.html file

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.