I have an issue when I use the following configuration line in my code:
scheduler.date.timeline_start = scheduler.date.week_start;
For some reason, this disables the “next” or “forward” scroll button at the top menu in Timeline view. I am running v3.6.
My sample code page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Technician's Schedule</title>
<script src='codebase/dhtmlxscheduler.js' type="text/javascript" charset="utf-8"></script>
<script src='codebase/ext/dhtmlxscheduler_timeline.js' type="text/javascript" charset="utf-8"></script>
<link rel='stylesheet' type='text/css' href='codebase/dhtmlxscheduler_glossy.css'>
<style type="text/css" media="screen">
html, body{
margin:0;
padding:0;
height:100%;
overflow:hidden;
}
</style>
<script type="text/javascript" charset="utf-8">
function init() {
scheduler.locale.labels.timeline_tab = "Timeline";
scheduler.locale.labels.section_custom="Section";
scheduler.config.details_on_create=true;
scheduler.config.details_on_dblclick=true;
scheduler.config.xml_date="%Y-%m-%d %H:%i";
scheduler.config.multi_day = true;
//===============
//Configuration
//===============
var sections=[
{key:1, label:"Joe Smith"},
{key:2, label:"John Doe"},
{key:3, label:"Geroge Lucas"}
];
scheduler.createTimelineView({
name: "timeline",
x_unit: "hour",
x_date: "%H:%i",
x_step: 6,
x_size: 28,
x_start: 0,
x_length: 24,
y_unit: sections,
y_property: "section_id",
render:"bar",
second_scale:{
x_unit: "day", // unit which should be used for second scale
x_date: "%D, %F %d" // date format which should be used for second scale, "Sat, July 01"
}
});
// Working week
scheduler.config.start_on_monday = false;
scheduler.config.preserve_scroll = false;
scheduler.date.timeline_start = scheduler.date.week_start;
//===============
//Data loading
//===============
scheduler.config.lightbox.sections=[
{name:"description", height:130, map_to:"text", type:"textarea" , focus:true},
{name:"custom", height:23, type:"select", options:sections, map_to:"section_id" },
{name:"time", height:72, type:"time", map_to:"auto"}
];
scheduler.init('scheduler_here',null,"timeline");
scheduler.load("data/connector.php");
var dp = new dataProcessor("data/connector.php");
dp.init(scheduler);
}
</script>
</head>
<body onload="init();">
<div id="scheduler_here" class="dhx_cal_container" style='width:100%; height:100%;'>
<div class="dhx_cal_navline">
<div class="dhx_cal_prev_button"> </div>
<div class="dhx_cal_next_button"> </div>
<div class="dhx_cal_today_button"></div>
<div class="dhx_cal_date"></div>
<div class="dhx_cal_tab" name="day_tab" style="right:204px;"></div>
<div class="dhx_cal_tab" name="week_tab" style="right:140px;"></div>
<div class="dhx_cal_tab" name="timeline_tab" style="right:280px;"></div>
<div class="dhx_cal_tab" name="month_tab" style="right:76px;"></div>
</div>
<div class="dhx_cal_header">
</div>
<div class="dhx_cal_data">
</div>
</div>
</body>
</html>
Any help would be appreciated.