Tag Archives: WebScheduler 2.0 SP1

Enable Multiple Cell Selection in WebScheduler.NET 2.0

One of the new features that available in WebScheduler.NET 2.0 SP1 is Multiple Cell Selection feature. Usually, to create a new event, user can simply click on an empty cell and fill the necessary data in the callout. However, this approach is not simple enough when user wants to create a new event with broader duration. This is now possible in WebScheduler.NET when Multiple Cell Selection feature is enabled.

Enabling Multiple Cell Selection
To enable the feature, simply set EnableMultipleCellSelection property to True. This feature works in conjunction with adding functionality, so DataEditing >> AllowAdd property must also be set to Yes.

EnableMultipleCellSelection property

EnableMultipleCellSelection property

Try to select multiple cells, fill the necessary data in callout and click Add Event. A new event will be created within the range. For example: select the cells which start from 8 AM – 12 AM. Note that the callout will display the date range of the selected cells.

Multiple Cell Select feature

Multiple Cell Select feature

When Add Event button is created, a new event which starts from 8 AM – 12 AM will be inserted.

New event inserted

New event inserted

As an alternative, user can select multiple cells and open the editing form. The selected date range will automatically be persisted in the start date and end date controls.

Selected date range persisted in built-in editing form

Selected date range persisted in built-in editing form

When enabled, this feature works consistently in all views that support data operation. Quarter and Year views don’t have this feature since the events are displayed for summary view only. Agenda view also doesn’t support this feature because the events are displayed as text based list only.

In Day view
In Day view, user can select multiple cells in the content. The same behavior is also supported in Split view. However, in Split view, user cannot select multiple resources. The selected cells will be limited to one resource only and the selected resources will be automatically persisted in callout and editing form.

Split View - Date range displayed in Callout

Split View - Date range displayed in Callout

Split View - New Event inserted

Split View - New Event inserted

  
In Week view
In Week view, user can select multiple cells in all day event area and content area. When user selects multiple cells in all day event area, the event will be inserted as all-day type event.
Week View - Select multiple=

Week View - Select multiple cells in AllDayEvent areaWeek View - All-day event inserted

In content area, when user selects multiple cells in different columns, the event will be created as switch-day event and thus will be displayed in all day event area.

Week View - Select multiple=

Week View - Select multiple cells in multiple columns

Week View - New Switch-day Event inserted

Week View - New Switch-day Event inserted

In Month view
In Month view, user can select multiple cells and the event will be inserted as all-day type event.
Month View - Multiple=

Month View - Multiple cells selected

Month View - New event inserted

Month View - New event inserted

In Timeline view
In Timeline view, user can selects multiple cells in the selected resource. The selection is limited to the selected resource only. The duration of the new event will be calculated according to the selected Timeline view mode. Note that the selected resource and date range are persisted in callout and editing form.

Timeline View - Selected=

Timeline View - Selected date range is displayed in CallOut

Timeline View - Selected=

Timeline View - Selected date range persisted in built-in editing form

Timeline View - New Event inserted

Timeline View - New Event inserted

Date range displayed in callout
Previously, only the start date and time is displayed in the callout when an event or an empty cell is selected. In some scenarios, the ability to see the date range of the event or selected cells is very critical. Therefore, the date range is now displayed in the callout when an event or empty cell(s) are selected.

Date range of event displayed in Callout

Date range of event displayed in Callout

Date range of selected=

Date range of selected cell(s) displayed in CallOut

To synchronize the detail info in all view, the date range is also displayed in Agenda view detail.

Date range displayed in detail info of Agenda view

Date range displayed in detail info of Agenda view

 
Client Side Event
When multiple cells are selected, developer can specify custom actions in OnMultipleCellSelected client side event. Five parameters will be passed to this event:
  • controlId, specifies the id of WebScheduler control.
  • startDate, specifies the start date of the selected date range.
  • endDate, specifies the end date of the selected date range.
  • isAllDay, specifies whether or not the event inserted will be all-day-typed event.
  • resource, specifies the selected resource object.
OnMultipleCellSelected client side event property

OnMultipleCellSelected client side event property

OnMultipleCellSelected client side event script example

OnMultipleCellSelected client side event script example

To use this client side event, you need to get WebScheduler.NET 2.0 Build 211 from Update Manager or My Components in TDN (http://dev2.intersoftpt.com).

Live Demo
For the real life experience, please browse the sample in the following link: Enable Multiple Cell Selection.

As usual, feel free to drop a comment or send your feedback to feedback@intersoftpt.com. Thanks!

Timeline view enhancements in WebUI Studio.NET 2008 R2 SP1

Timeline view feature first appearance is in WebScheduler 2.0 under WebUI Studio.NET 2008 R2. Now with the release of WebUI Studio.NET 2008 R2 SP1, there are couple of new advanced features in Timeline – all the more reasons for you to upgrade.
These are the Timeline’s major new features and enhancements:

  1. Timeline views.
  2. Timeline drilldown capability, up to five levels.
  3. Drag & drop enhancement.
  4. Enlarge Editing Form’s description textbox.

Timeline views
Here is the fantastic feature from Timeline that you can rely on. Right now Timeline includes 4 views that you can choose based on your scenario. To give you better ideas about this feature, I will show you the views one by one.

Timeline Month view
In this view, you will be able to see the event(s) / schedule within 1 month showing day per day. Using drilldown function you can have Quarter view from Month view. I will explain about how you can achieve Quarter view in Timeline drilldown section.

Timeline Month view

Timeline Month view

Timeline Week view
Week view is just like Month view, the difference is in Week view, and you will only see the event / scheduler within 1 week. The Week view speciality is there are 2 week option that you can choose, FirstDay and WeekNumber.

FirstDay option, the days of the month will be divided by 7 so each month will have 4 weeks. Week FirstDay starts on date 1 every month. Each week will have 7 days, especially on the fourth week, the days is vary depends on how many days in the selected month (for example, if it is January, then the fourth week will have 3 days, starts from 29 to 31).

firstday-weekview

firstday-weekview

WeekNumber option, the week appearance will follow the selected week number. For example, the current WeekNumber is 10 so the appearance days will be March 2nd to March 8th.

weeknumber-weekview

weeknumber-weekview

Timeline DayHourly view
This is the default view in Timeline. In this view, you can see the event(s) / schedule from hour to hour within NumberOfDays and range of time.

Timeline DayHourly

Timeline DayHourly

Timeline Day15Minutes view
As said in the title, this view allows you to see the event(s) / schedule from 15 minutes to 15 minutes of the selected date.

Timeline Day15Minutes

Timeline Day15Minutes

Timeline Quarter view
This is a new view that we introduce in SP1. It displays the schedule within quarter from day to day. You can activate it by “zoom out” from month view.

Quarter view

Quarter view

Timeline drilldown
With a lot of views in Timeline to support many different scenarios, we came up with a new idea to simplify the views management. For instance, the initial view of the Timeline is set to Month mode. Next, what if users would like to switch to Week mode to see the events data in more details? The answer is “runtime data drilldown”, which allows users to perform “zoom in” or “zoom out” in a single click.

“Zoom in” means narrowing the view into more details whereas “zoom out” means widening the view into more general. So clicking on “zoom in” in Month view will switch the Timeline to Week view, Week view will switch to DayHourly and finally DayHourly will switch to Day15Minutes view. Clicking “zoom out” is the contrary.

drilldown

drilldown


Drag and drop enhancement
As you might already aware, Timeline’s row is very flexible. It can be resized based on the amount of the events.  Using drag and drop, we can update the Timeline’s event from Resource A to Resource B. So, in order to have a good drag and drop capability, the dragged Timeline’s event should be placed in the right position of the rows. To accommodate this requirement, we have enhanced the drag and drop mechanism to ensure the dragged Timeline’s event to appeared in the correct row.

Drag and Drop

Drag and Drop

Enlarge EditingForm’s description textbox.
Users often write a quite lengthy description for their events. In this SP1, we have enhanced the Editing Form to make it easier for users to write long description. The enhanced EditingForm.aspx now includes new “maximize” icon beside the description caption. Simply click on the icon to enlarge the description’s textbox.

Enlarge description textbox

Enlarge description textbox

I hope you enjoy the enhancements that we’ve made into WebScheduler 2.0 SP1. Let me know if you have any questions or feedback about Timeline view and related features.

Regards,
Budianto.