如何使用easyui实现spreadjs日历

收藏

在论坛中找了一下只有一个juqeryUI实现的例子http://blog.gcpowertools.com.cn/post/Datepicker.aspx

但是会与项目中使用的easyui冲突无法使用
请问有没有easyui实现日历的demo

Clark.Pan · Clark.Pan

这个没有，您参考jqueryUI那个demo稍微改一下，就行了。

安泰得 · 安泰得

本帖最后由安泰得于 2018-4-12 14:05 编辑

你好我想再请问一下
对比在上面提到的jqueryUI的demo中,可以使用日历控件给input赋值
是在选择完毕之后焦点离开输入框才触发DatePickerCellType.prototype.getEditorValue
image.png468775329.png

而在使用easyUI中的时候
getEditorValue这个事件触发有点奇怪
image.png682074889.png

如图中所示在输入框还没从日历中取到值的时候就已经触发getEditorValue了
没法取到对应的日期
image.png879966125.png

请问这个问题是出在哪儿,如何解决

安泰得 · 安泰得

又尝试了一下easyUI中日历上的的 onSelect 事件
image.png132481078.png

在SpreadJs的容器外是能正常取到日期但是在activateEditor这个事件中对应方法绑定的话就不会触发

DatePickerCellType.prototype.activateEditor = function (editorContext, cellStyle, cellRect) {
//Initialize input editor.
if (editorContext) {
$editor = $(editorContext);
GC.Spread.Sheets.CellTypes.Base.prototype.activateEditor.apply(this, arguments);
//$editor.datepicker();
//$editor.css("position", "absolute");
//$editor.attr("gcUIElement", "gcEditingInput");
//$(".ui-datepicker").attr("gcUIElement", "gcEditingInput");
$editor.attr("class", "easyui-datebox");
$editor.datebox({
//required:true,
onSelect:function(date){
alert(date.getFullYear()+":"+(date.getMonth()+1)+":"+date.getDate());
}
});
}
}

Clark.Pan · Clark.Pan

您有没有加上这句话呢
$(".ui-datepicker").attr("gcUIElement", "gcEditingInput");这句话的意思是将其组件视为spreadjs本身的一部分，应用spreadjs本身的处理过程。

安泰得 · 安泰得

ClarkPan 发表于 2018-4-12 17:53
您有没有加上这句话呢
$(".ui-datepicker").attr("gcUIElement", "gcEditingInput");这句话的意思是将其组 ...

了解! 非常感谢你的帮助!

Clark.Pan · Clark.Pan

不客气，有什么问题欢迎另开新帖进行询问。

		自动登录	找回密码
密码			立即注册

[已处理] 如何使用easyui实现spreadjs日历

6 个回复

讲师达人

悬赏达人

微信认证勋章

SpreadJS 认证

SpreadJS 高级认证

元老葡萄