Scheduler GUI

Overview

dhtmlxScheduler is a user-friendly event scheduler component, which allows you to present and schedule any event, such as a board meeting, a business lunch, a conference call, a family reunion, a movie night or any other group event. You are allowed to create, edit, delete and drag-and-drop events in the scheduler.

dhtmlxScheduler manipulation is quite easy. Let's begin.

First of all, you should know that dhtmlxScheduler is able to schedule events for days, weeks and months. To set your time mode, you should select one of the three available views in the views panel, located on the left side of the calendar panel.

Backward/forward arrows on the right side of the calendar panel allow you to move within calendar dates. 'Today' button enables you to turn to the current date. The selected date period is specified to the left of the 'today' button. You can select Day, Week or Month View on the segmented button in the left top corner. Hours scale is located on the left side of the scheduler.

Creating a New Event

To create a new event, double click on the desired date field. After that "New event" window appears.

Here you can enter the event's name and set start and end time of the event. To save the event in the calendar, click Save button in the left bottom corner of the window. If you would like to escape this window, without saving the event, click Cancel.

One more way to create a new event is to press the left button of the mouse and drag date area to define the date period of the event. This can be done in Day, Week or Month views.

Editing Event

To change the event's details, click on the event box. A small bar will appear to the left of the event box. Click the appropriate button to edit the event's title or details, or to delete the event.

When you click the Details button, a window with event's details appears. It's the same window, as you've seen, when you created an event - here you can change the event's description and time period. To call this window, you can also double-click on the necessary event box.

To change the event's date and time, you can also drag the event box in Week/Month View to the necessary date field. In Day View you can change the event time, by dragging the event box and changing its size.

Setting a Multiday Event

There is a possibility to set a multiday event. You can do it in the "New event" window, when you set start and end dates of the event.

Drag-and-Drop in dhtmlxScheduler

dhtmlxScheduler supports drag-and-drop, thus you are allowed to create events or move the existing ones within calendar area according to your needs.

Deleting an Event

There are two ways to delete an event:

1. Click the appropriate button in the left bar of the event.
2. Call Details window and click Delete button in the right bottom corner.

Back to top