如何在DHTMLX活动日历上制作onmouse?

时间:2017-08-18 11:58:02

标签: dhtmlx dhtmlx-scheduler

我已将DHTMLX事件日历集成到我的Java项目中。我想在mouseover事件中显示事件详细信息。我试过打电话给dhtmlxscheduler_tooltip.js,但它没有用。



scheduler.attachEvent("onMouseMove", function(event_id, e){ // (scheduler event_id, browser event)
	var ev = e||window.event;
	var target = ev.target||ev.srcElement;

	if (event_id || dhtmlXTooltip.isTooltip(target)) { // if we are over event or tooltip
		var event = scheduler.getEvent(event_id) || scheduler.getEvent(dhtmlXTooltip.tooltip.event_id);
		dhtmlXTooltip.tooltip.event_id = event.id;
		var text = scheduler.templates.tooltip_text(event.start_date, event.end_date, event);
		
		if (_isIE) { //make a copy of event, will be used in timed call
			var evt = document.createEventObject(ev);
		}
		
		dhtmlXTooltip.delay(dhtmlXTooltip.show, dhtmlXTooltip, [evt||ev, text]); // showing tooltip
	} else {
		dhtmlXTooltip.delay(dhtmlXTooltip.hide, dhtmlXTooltip, []);
	}
});

/* Could be redifined */
scheduler.templates.tooltip_date_format=scheduler.date.date_to_str("%Y-%m-%d %H:%i"); 

scheduler.templates.tooltip_text = function(start,end,event) {
	return "<b>Event:</b> "+event.text+"<br/><b>Start date:</b> "+scheduler.templates.tooltip_date_format(start)+"<br/><b>End date:</b> "+scheduler.templates.tooltip_date_format(end);
};
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:1)

dhtmlxscheudler.js 之后添加 ext / dhtmlxscheduler_tooltip.js 扩展名应足以显示事件的工具提示。请查看以下代码段:

$matches[0][1]
scheduler.config.xml_date = "%Y-%m-%d %H:%i";

scheduler.templates.tooltip_text = function(start, end, event) {
	return "<b>Event:</b> " + 
    event.text + 
    "<br/><b>Start date:</b> " + 
    scheduler.templates.tooltip_date_format(start) + 
    "<br/><b>End date:</b> " + 
    scheduler.templates.tooltip_date_format(end);
};

scheduler.init('scheduler_here', new Date(2017, 3, 3), "week");

scheduler.parse([
	{ start_date: "2017-04-03 01:00", end_date: "2017-04-03 18:00", text: "Task A-12458" },
	{ start_date: "2017-04-04 01:00", end_date: "2017-04-04 12:00", text: "Task A-89411" }
], "json");