General

Getting Started Quick Install Using with Cordova Using with Ionic Using with Meteor Mobiscroll CLI ES6 Modules Instance Customizing the Look and Feel Upgrade From Trial Utility functions Update version Upgrade Guide v4

Date & Time pickers

Calendar

Usage Options Events Methods Localization Conversion functions Theming

Date & Time

Usage Options Events Methods Localization Theming

Range

Usage Options Events Methods Localization Theming

Timespan

Usage Options Events Methods Localization Conversion functions Theming

Event Calendar

Usage Options Events Methods Localization Theming

Form components

Accordion

Usage

Alerts & Notifications

Alert Confirm Prompt Toast Snackbar Notes

Buttons

Usage Options Theming

Checkbox

Usage Attributes Theming

Dropdown Forms

Usage Options Events Methods Localization Validation Groups Theming

Progress

Usage Attributes Methods Theming

Radio Buttons

Usage Attributes Theming

Rating

Usage Attributes Methods Theming

Segmented

Usage Options Theming

Slider

Usage Attributes Methods Theming

Stepper

Usage Attributes Theming

Switch

Usage Options Theming

Textfields

Usage Attributes Theming

Timer

Usage Options Events Methods Localization Theming

Responsive list

Cards

Usage Options Methods Theming

Listview

Usage Options Events Methods Data attributes Localization Theming

Scrollview

Usage Options Events Methods Localization

Numeric pickers

Measurement

Usage Options Events Methods Temperature Speed Distance Mass Force Localization Theming

Number

Usage Options Events Methods Localization Theming

Numpad

Usage Options Events Methods Localization Decimal Timespan Time Date Conversion functions Theming

Pickers & dropdowns

Color

Usage Options Events Methods Localization Theming

Image

Usage Options Events Methods Data attributes Localization Theming

Option List

Usage Options Events Methods Localization Data attributes Theming

Scroller

Usage Options Events Methods Localization Conversion functions Theming

Select

Usage Options Events Methods Localization Theming

Treelist

Usage Options Events Methods Localization Theming

Layout & navigation Tools

Icons Language Modules

Accessibility

Section 508 WAI-ARIA Support Keyboard Support RTL Support

Utils

A collection of general purpose utility functions which can be used independently from Mobiscroll component instances.

1. Platform

mobiscroll.platform

Description

Information about the current platform.

Name	Type	Description
name	String	Possible values: 'ios' 'android' 'windows'
majorVersion	Number	The major version of the platform
minorVersion	Number	The minor version of the platform

2. Format Date

mobiscroll.util.datetime.formatDate(format, date[, settings = {}])

Description

Format a date into a string value with a specified format.

Example

// Produces '2015-02-19'
mobiscroll.util.datetime.formatDate('yy-mm-dd', new Date(2015, 1, 19));

Parameters

Name	Type	Default	Description
format	String		The format can be combinations of the following: `m` - month of year (no leading zero) `mm` - month of year (two digit) `M` - month name short `MM` - month name long `d` - day of month (no leading zero) `dd` - day of month (two digit) `D` - day of week (short) `DD` - day of week (long) `y` - year (two digit) `yy` - year (four digit) `h` - 12 hour format (no leading zero) `hh` - 12 hour format (leading zero) `H` - 24 hour format (no leading zero) `HH` - 24 hour format (leading zero) `i` - minutes (no leading zero) `ii` - minutes (leading zero) `s` - seconds (no leading zero) `ss` - seconds (leading zero) `a` - lowercase am/pm `A` - uppercase AM/PM `'...'` - literal text `''` - single quote anything else - literal text
date	Date		The date value to format
settings	Object	`{}`	A set of key/value pairs that configure the format. All settings are optional: amText (default: `'am'`) - Text for AM dayNames (default: `['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']`) - The list of long day names, starting from Sunday. dayNamesShort (default: `['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']`) - The list of abbreviated day names, starting from Sunday. monthNames (default: `['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']`) - The list of full month names. monthNamesShort (default: `['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']`) - The list of abbreviated month names. pmText (default: `'pm'`) - Text for PM shortYearCutoff (default: `'+10'`) - Set the cutoff year for determining the century for a date (used in conjunction with dateFormat 'y'). If a numeric value (0-99) is provided then this value is used directly. If a string value is provided then it is converted to a number and added to the current year. Once the cutoff year is calculated, any dates entered with a year value less than or equal to it are considered to be in the current century, while those greater than it are deemed to be in the previous century.

3. Parse Date

mobiscroll.util.datetime.parseDate(format, value[, settings = {}])

Description

Extract a date from a string value with a specified format.

Example

mobiscroll.util.datetime.parseDate('yy-mm-dd', '2015-02-19'));

Parameters

Name	Type	Default	Description
format	String		The format can be combinations of the following: `m` - month of year (no leading zero) `mm` - month of year (two digit) `M` - month name short `MM` - month name long `d` - day of month (no leading zero) `dd` - day of month (two digit) `D` - day of week (short) `DD` - day of week (long) `y` - year (two digit) `yy` - year (four digit) `h` - 12 hour format (no leading zero) `hh` - 12 hour format (leading zero) `H` - 24 hour format (no leading zero) `HH` - 24 hour format (leading zero) `i` - minutes (no leading zero) `ii` - minutes (leading zero) `s` - seconds (no leading zero) `ss` - seconds (leading zero) `a` - lowercase am/pm `A` - uppercase AM/PM `'...'` - literal text `''` - single quote anything else - literal text
value	String		The string value to parse
settings	Object	`{}`	A set of key/value pairs that configure the format. All settings are optional: amText (default: `'am'`) - Text for AM dayNames (default: `['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']`) - The list of long day names, starting from Sunday. dayNamesShort (default: `['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']`) - The list of abbreviated day names, starting from Sunday. monthNames (default: `['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']`) - The list of full month names. monthNamesShort (default: `['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']`) - The list of abbreviated month names. pmText (default: `'pm'`) - Text for PM shortYearCutoff (default: `'+10'`) - Set the cutoff year for determining the century for a date (used in conjunction with dateFormat 'y'). If a numeric value (0-99) is provided then this value is used directly. If a string value is provided then it is converted to a number and added to the current year. Once the cutoff year is calculated, any dates entered with a year value less than or equal to it are considered to be in the current century, while those greater than it are deemed to be in the previous century.

4. Vibrate

mobiscroll.util.vibrate([time = 50])

Description

Vibrates the device with the specified duration. It checks if the browser/device supports the vibration API, so no additional check is needed.

Example

// Vibrates 200 milliseconds
mobiscroll.util.vibrate(200);

Parameters

Name	Type	Default	Description
time	Number	50	Number of milliseconds to vibrate.

Scheduling & calendaring

Date & time picking

Mobile UI Patterns

Docs

Community Forum

Knowledge base

Customers

Blog