All dhtmlx component are compatible with DhtmlxScheduler and, what is notable, they can be used for creating new events. All you need is drag-and-drop the needed data element to a cell.
Let's consider it by way of example (dhtmlxTree).
Firstly:
1. Download the dhtmlxTree package from the server and place it in a folder.
2. Include the necessary js and css files into the header of html file.
<script src='../../codebase/ext/dhtmlxscheduler_outerdrag.js' type="text/javascript" charset="utf-8"></script> <script src='../../../dhtmlxTree/codebase/dhtmlxtree.js' type="text/javascript" charset="utf-8"></script> <link rel='stylesheet' type='text/css' href='../../../dhtmlxTree/codebase/dhtmlxtree.css'>
Then:
3. Init scherduler and tree
4. Enable drag-and-drop command.
tree.enableDragAndDrop(true);
5. Define the appropriate event:
scheduler.attachEvent("onExternalDragIn", function(id, source, event){ var label = tree.getItemText(tree._dragged[0].id); scheduler.getEvent(id).text = label; return true; });
Now, you can easy create new events, containing tree data - just drag and drop the desired node.