Hello,
To add some functionality to your custom button, you can use onBeforeViewChange
event with the required mode that you specified at your custom button:
https://docs.dhtmlx.com/scheduler/api__scheduler_onbeforeviewchange_event.html ;
For example:
<div class="dhx_cal_tab" data-tab="Help"></div>
Then, onBeforeViewChange
handler will look like:
scheduler.attachEvent("onBeforeViewChange", function(old_mode,old_date,mode,date){
if(mode == "Help"){
alert("custom tab click");
return false;// prevent view change on custom button click
}
return true;
});
Please check the following snippet:
https://snippet.dhtmlx.com/bkl6wun9 ;
Note that I’ve use data-tab
attribute in the tab element – this will only work in dhtmlxScheduler v6.0. If you use dhtmlxScheduler 5.3 or earlier – you’ll need to use the name
attribute:
<div class="dhx_cal_tab" name="Help_tab"></div>
Also, you can change the scheduler.config.header
by adding your custom button with the following syntax:
scheduler.config.header = [
"day",
"week",
"month",
{html:"click me!", click:function(){alert("done!")}},
"date",
"prev",
"today",
"next"
];
Here related article:
https://docs.dhtmlx.com/scheduler/api__scheduler_header_config.html ;
Please check the example with custom button which directs you to another website:
https://snippet.dhtmlx.com/1ty4xgo5