The newest update v6.0 introduces two major changes in the structure of the Scheduler package:
1) All files of extensions are now bundled with the dhtmlxscheduler.js file. Therefore, in order to activate any of extra extensions provided by DHTMLX Scheduler, you need to use the API call.
<script src="../codebase/dhtmlxscheduler.js"></script>
<script src="../codebase/ext/dhtmlxscheduler_active_links.js"></script>
or
import "dhtmlx-scheduler";
import "dhtmlx-scheduler/ext/dhtmlxscheduler_active_links";
Then you need to remove the extension file and enable the extension using the scheduler.plugins method:
scheduler.plugins({
active_links: true
});
See the full list of extensions here.
If you use a modified version of extension files or have developed custom extensions, include them as files on a page and they will work.
Note, that the dhtmlxscheduler_csp.js extension is completely removed and does not need to be enabled manually.
2) All locales are now embedded into the dhtmlxscheduler.js file. To activate them, use the API call.
scheduler.i18n.setLocale("de");
DataProcessor constructor has moved from the global dataProcessor function to the scheduler.DataProcessor function.
If you use the dataProcessor in your app, you'll need to update the code that initializes the dataProcessor:
// obsolete
var dp = new dataProcessor("/scheduler/backend/events");
dp.init(scheduler);
dp.setTransactionMode("REST", false);
This code above should be replaced with the following:
// good
var dp = new scheduler.DataProcessor("/scheduler/backend/events");
dp.init(scheduler);
dp.setTransactionMode("REST", false);
The recommended approach is to use the scheduler.createDataProcessor function:
// even better
var dp = scheduler.createDataProcessor({
url: "/scheduler/backend/events",
mode: "REST"
});
In this case, DataProcessor.init(scheduler) call is no longer required, DataProcessor.setTransactionMode can be called as usual if needed.
The dhtmlx object definition was removed from dhtmlxscheduler.js. Thus, some methods and global objects have been deprecated in v6.0.
1) The following methods have been deprecated and replaced with:
Obsolete methods | Working methods |
dhtmlx.alert | scheduler.alert |
dhtmlx.confirm | scheduler.confirm |
dhtmlx.modalbox | scheduler.modalbox |
dhtmlx.uid | scheduler.uid |
dhtmlx.copy | scheduler.copy |
dhtmlx.mixin | scheduler.mixin |
dhtmlx.defined | scheduler.defined |
dhtmlx.bind | scheduler.bind |
dhtmlx.assert | scheduler.assert |
window.dataProcessor | scheduler.DataProcessor |
No changes in the arguments or behavior of the methods were made.
2) The following global objects have been deprecated:
If you still need these objects in you application, enable the legacy plugin:
scheduler.plugins({
legacy: true
});
The default handler for the swipe gesture has been disabled by default.
You can re-enable it using the scheduler.config.touch_swipe_dates config, as follows:
scheduler.config.touch_swipe_dates = true;
Box-sizing mode of event elements in Month View has been changed from content-box to border-box in all skins.
The affected elements are: .dhx_cal_event_clear and .dhx_cal_event_line.
It shouldn't cause any visible changes, but if you redefined the render of Month view events, or use a custom skin, you may need to take this change into account.
Since version 5.2 it is possible to drag events by any part of the body, not just by the header as it worked in the earlier versions. If you want to restore the previous functionality, make use of the drag_event_body and set it to false (by default the property is enabled).
scheduler.config.drag_event_body = false;
They still work, but will be removed in future. Here is how they should be replaced:
scheduler.attachEvent("onXLS",function(){}); →
scheduler.attachEvent("onLoadStart",function(){});
scheduler.attachEvent("onXLE",function(){}); →
scheduler.attachEvent("onLoadEnd",function(){});
Below there is the scheme of replacing previously used API:
Since v5.2 the default values of the xml_date config, and xml_date and xml_format templates are undefined. Thus if you haven't assigned any values to them, they won't work.
However, Scheduler will continue to use the old names of the config and templates, so if you've redefined those APIs in your code, they will work as before. For example:
// will work correctly
scheduler.templates.xml_date = function(datestring){
return new Date(datestring);
};
To restore the previous default date format, specify the setting below:
scheduler.config.date_format = "%m/%d/%Y %H:%i";
Since v5.2 Scheduler tries to automatically identify the format of dates that should be parsed, so there can be some changes in the work of related functions scheduler.date.str_to_date, scheduler.templates.format_date, and scheduler.templates.parse_date.
If you want to restore previous behavior and get dates in the format defined by the user, use the parse_exact_format configuration option:
scheduler.config.parse_exact_format = true;
In previous versions it was possible to set the value of the vertical setting of the Multiselect control as a string, like this:
{ name:"userselect", type:"multiselect", ..., vertical:"false" }
Since v5.2 the property takes just a boolean value, i.e. true or false.
{ name:"userselect", type:"multiselect", ..., vertical: false }
In case you've used the string "false" value for the vertical property, you need to change it into the boolean one.
Smart rendering and horizontal scroll features required a complete remaking of the timeline markup. It affected Timeline, TreeTimeline and all modes of these views.
The most notable change is that HTML elements TABLE, TR, TD were removed from the markup and replaced with DIVs with appropriate class names.
If you use table tags in CSS selectors for styling the timeline, an action will be needed in order to migrate such CSS. The overall DOM structure didn't undergo many changes, thus migration would mostly require rewriting several CSS selectors in order for them to match the new markup.
For the reference, here is a sample of CSS selectors before and after the update given below.
Before:
After:
Glossy and Classic skins were deprecated and removed since v5.0. If you use them, you'll either need to migrate to another skin or keep using a corresponding CSS file from an older version.
Release of v5.0 involves a major CSS overhaul, which may create issues with updating heavily CSS-customized applications: the existing styles may stop working due to the specificity of renewed dhtmlxScheduler styles. There is no general solution for this, the migration will require investigating and correcting CSS issues.
The update also fixes the POST (insert) route of dataProcessor in the REST mode, the request no longer sends a temporary event id to the server.
The following route:
POST /api/{tempId}
//e.g.
POST /api/1234567890
should be changed to this one:
POST /api
Since v.4.3 the extensions Week Agenda View, Grid View, Timeline View, Units View, Multisection Events are no longer available in the Standard Edition that is distributed under GNU GPL v2.
If you still want to use them, you may either continue using the version 4.2 (or older), or obtain either Commercial or Enterprise license.
Please check the license details here.
Public API is fully backward compatible.
The default skin is changed to "terrace", ext/dhtmlxscheduler_dhx_terrace.js is removed. To change the skin back to the classic one, just include the related CSS file (codebase/dhtmlxscheduler_classic.css). For more details check Skins.
multi_day is enabled by default, and if you want to revert such a behavior, add:
scheduler.config.multi_day = false;
Scheduler detects the used skin, based on the name of the CSS file, so if you are using a custom skin (which is not based on "terrace"), rename its css file to dhtmlxscheduler_{skin name}.css. Also, you can disable the skin auto-detection by adding the following line before scheduler.init:
scheduler.skin = "{skin name}";
The following API is deprecated: getEventText, getEventStartDate, getEventEndDate, setEventText, setEventStartDate, setEventEndDate (those methods are still available, but will be removed in Scheduler 5.x).
Instead, you can use scheduler.getEvent() and set/get properties directly from the event object.
Fully backward compatible
Fully backward compatible
Public API is fully backward compatible.
Public API is fully backward compatible.
For private API, check Scheduler 3.0.
sources/locale_se.js => sources/locale_sv.js
sources/locale_recurring_se.js => sources/locale_recurring_sv.js
codebase/dhtmlxgrid_recurring.js => codebase/ext/dhtmlxgrid_recurring.js
codebase/dhtmlxgrid_recurring.css => codebase/ext/dhtmlxgrid_recurring.css
codebase/dhtmlxgrid_units.js => codebase/ext/dhtmlxgrid_units.js