dhtmlxgrid是我在javaeye上面发现的一个不错的东东,并决定把dhtmlxgrid引入到我们的项目中来,但是在看calender部分的时候发现1.2 standard 版本的有问题,就是在选择日期的时候,点击翻月的小图标,日期选择界面会消失。但是1.0的pro版本没有这个问题,我看了一下代码,这应当与程序当中对detach的处理那块有关,无奈dhtmlxgrid的代码太长了,看的俺是头昏眼花,腿抽筋,几次乱改都未成功,只好想想看看有什么旁门左道可以替代他的功能。
我原先项目中的日期选择组件用的是popcalender.js,对他比较熟悉就从他下手,修改的方案如下:抛弃yahoo UI的calender组件,使用popcalender来替代,需要更改dhtmlxgrid_excell_calender.js和popcalender.js这两个文件。在原先的代码中,作者应该是通过调用detach来实现对cell的赋值的,但是calender有个特殊性,就是他需要翻月操作的,而据我观察,在双击调用出日期选择界面后,只要点击鼠标,即调用detach,执行里面的代码,这就是为什么点击翻月按钮,选择界面会关闭,而且detach只会执行一次。我采用的解决方案是修改pop当中的closecalender函数,他是在用户选择日期的时候调用的,在他里面对当前操作的cell进行赋值操作,这样,问题就会迎刃而解了。
先看dhtmlxgrid_excell_calender.js
js 代码
-
-
-
-
-
- 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;
- }
-
- }
-
在popcalender当中主要是修改closeCalender这个函数,在他里面添加一下两段代码:
js 代码
- //ctlToPlaceValue在这个地方就是grid当中的cell
- ctlToPlaceValue.val = constructDate(dateSelected,monthSelected,yearSelected);
- ctlToPlaceValue.innerHTML = ctlToPlaceValue.val;
还有就是在popUpCalendar函数中,在
- crossobj.left = fixedX==-1 ? ctl.offsetLeft + leftpos : fixedX
前面加一句
js代码
- leftpos<0?leftpos=0:leftpos=leftpos;
ok,get it!
ie6和firefox1.5测试通过,修改后的代码我打包了,希望能够对使用dhtmlxgrid的朋友提供些帮助,例子可以看samples目录下面的 复件 calendar_grid.html文件
有任何疑问,欢迎email给我,rautinee@yahoo.com.cn ,欢迎大家来信讨论dhtmlxgrid的应用。
分享到:
相关推荐
在“Dhtmlx实例”这个压缩包中,你可能会找到一些预设的示例代码,这些代码演示了如何在实际项目中使用这些组件。通过分析和学习这些例子,你可以了解如何初始化组件、设置属性、响应用户交互以及如何与后端数据源...
同时,考虑到不同设备和Android版本之间的兼容性问题,建议使用`AppCompatActivity`或`Fragment`作为容器,并使用`Support Library`或`AndroidX`库。 总之,`Calender`组件在Android应用中扮演着重要的角色,无论是...
采用javascript实现calender
在本文中,我们将深入探讨如何使用Qt框架重新实现一个自定义的日历控件,这个控件具有优秀的日期和时间适应性,并且与ComboBox组件有良好的交互。我们将主要围绕"calender_self_qt.zip"中的内容展开,分析其设计原理...
在Android系统中,Calendar应用是用户管理日常日程和时间安排的重要工具。本文将深入探讨“android calender”官方源码,分析其背后的实现机制、关键类和接口,以及如何利用这些源码来优化和自定义日历功能。 首先...
在这个日历组件中,CSS 可能用于设定颜色、字体、布局、 hover 和 active 状态的效果,以及响应式设计,使得日历在不同设备上都有良好的显示效果。 3. **JavaScript(JS)**:JS 是实现日历动态交互的关键。它可以...
`ios calender`这个项目提供了一个高质量的示例,展示了如何在iOS应用中集成和操作日历功能。以下将详细介绍iOS日历API的使用,以及在这个`JTCalendar-master`项目中可能涉及到的关键知识点。 首先,我们需要了解...
### Java中Date类和Calendar...`Calendar`不仅提供了更丰富的日期时间操作,而且还避免了一些`Date`类中存在的问题,比如日期偏移量的处理等。对于需要进行复杂日期时间操作的应用来说,建议优先考虑使用`Calendar`类。
同步Google Calender 至outlook
我们可以使用数组或数据结构来存储这些信息,例如,一个二维数组可以代表一年中的每一天,其中每个元素对应一天,并记录该天的状态(如是否为签到日、是否有活动等)。 接下来,我们关注日历的展示方式。在本例中,...
ASP.NET 中的 Calender 控件是开发者常用的一个控件,它可以帮助开发者快速创建一个日期选择器,提高用户体验。但是,如何正确使用 Calender 控件却是一个不小的问题。下面我们将详细介绍 ASP.NET 中的 Calender ...
标题中的"unigui_calender_delphi_delphiunigui_unigui1530_mozaffari2_unigui" 提到了几个关键元素,它们是 "unigui"、"calender"、"delphi",以及版本号"1530"和可能与作者或开发团队相关的"Mozaffari2"。...
5. **测试与调试**:在实际项目中部署并测试"calender.js",确保在各种浏览器和设备上都能正常工作,同时使用开发者工具进行调试,找出并修复可能存在的问题。 总的来说,"calender.js"作为一个JavaScript日历组件...
乱码:如果日历出现中文乱码,并且如果在Eclipse中,那么请调整js的属性中编码为utf-8,html页面亦如是。 效果:页面为一个TextField空间,隐藏一个Div。点击TextField,显示Div,加载日历;点击某一日期,将日期值...
在本案例中,我们将深入探讨`calender`日历插件的用法,并通过在myEclipse中运行提供的代码来实践其功能。 首先,`calender`日历插件通常支持多种视图,如日视图、周视图、月视图和年视图,这使得用户可以根据需求...
1. **模块定义**:在`calender.v`文件中,你会看到一个或多个模块定义,比如`module calendar;`。每个模块都代表一个独立的硬件实体,如计算器中的加法器、寄存器等。在这个万年历模块中,可能会包含年、月、日等...
在本文中,我们将深入探讨日历插件的使用,特别是以"art-calender-test"为例。日历插件是Web开发中的一个重要工具,它能够帮助用户直观地查看和管理日期相关的事件,常用于网站的预约系统、日程管理、时间表展示等...
首先,Android的Calendar API位于`java.util.Calendar`类中,但通常我们在Android应用开发中会使用`android.provider.CalendarContract`,这是一个更强大的接口,它允许我们读取、写入和管理系统的日历事件。...
在本文中,我们将深入探讨MFC(Microsoft Foundation Classes)日历控件的开发,这是一个基于C++的编程项目,用于创建美观且功能丰富的日历应用。MFC是微软提供的一个C++类库,用于简化Windows应用程序的开发,它...
标题中的"proj---cal.rar_calender"暗示这是一个与日历应用相关的项目,可能是用Java 2 Micro Edition (J2ME)开发的。J2ME是Java平台的一个版本,主要用于嵌入式设备,如早期的移动电话,它允许开发在这些设备上运行...