What’s New
Mobiscroll 5 beta 4 is out and it comes with a new date and time range picker. Previously we introduced the date picker that includes both the scrollers and calendar. After single, multiple value selection we are adding range selection for date and time.
Part of a bigger picture
We decided to keep it under the date picker for a couple of reasons. First, because the different select modes have a lot of commonalities. Second, we would like to make switching from range selection to a single date selection natively supported. One of the most common use-cases of the range picker is booking flights and in v5 switching between one-way and returning flights is as easy as changing an option runtime.
Customizing the experience
One of the great new features of the range is the hover effects and range highlight control. This is a great improvement in terms of UX. Actually seeing the highlighted range before clicking on the selection will make this a more fluid experience.
Furthermore, you have control over the start/end labels. You can hide them or simply rename it to something meaningful.
See for yourself and give it a try with the live demos.
Date, time or both
Handled under the same component, use the controls option to set wether it is date, time or date & time range selection. There are two options for date selection: calendar or scroller while the time picker is always a scroller or dropdown depending if it’s used with touch or pointer interaction.
Months or weeks
And of course, the range select works with a single or multi month calendar. This can be one, two, three months or whatever makes sense.
Multiple month view with range selection
Week views support range selection.
Two week view with range selection
Play around with the configuration options on the demo page.
MOBISCROLL 5.0-beta4
Agenda
FIXED
- We fixed and issue where the month name in the header was not always in sync with the dynamic ‘locale’ change.
Datepicker
NEW
- We added range select support. Now the datepicker can also be used for picking date and time ranges, in addition to single and multiple selection.
FIXED
- We fixed the min/max validation when setting a value externally or the min/max options were updated dynamically.
- We fixed an issue which prevented the dynamic update of the picker header in inline mode.
- We fixed the dynamic change between desktop and mobile.
- We fixed and issue where the month name in the header was not always in sync with the dynamic ‘locale’ change.
- We fixed multiple month rendering in RTL mode.
- We fixed multiple month rendering, when the number of months was passed through the
responsiveoption. - We fixed an issue which caused the scroller wheel values to disappear when switching between mobile and desktop mode.
Eventcalendar
FIXED
- We fixed and issue where the month name in the header was not always in sync with the dynamic ‘locale’ change.
Popup
FIXED
- We fixed a bug which prevented the Space key to work in form inputs placed in popups.
Scheduler
FIXED
- We fixed and issue where the month name in the header was not always in sync with the dynamic ‘locale’ change.
For the full changelog please visit our release history. The beta is available to customers with and active Event Calendar or Framework and Complete license. Get in touch if you are interested.
PS. You will find an upgrade guide for moving from Mobiscroll 4 to Mobiscroll 5.