v7.3.0

ModeSelector
Widget

Displays a UI which allows selection of calendar modes. The modes can be displayed as a ButtonGroup or a single Button with a menu. Which presentation is used depends on the minified config property. By default, this is set responsively in order to present the best UI for different screen sizes.

The buttons to select each mode may be accessed from the Calendar's widgetMap. The name is created from the mode name plus 'ShowButton', so the button to show the week mode would be accessed by myCalendar.widgetMap.weekShowButton

If the mode selector is minified, and the modes are offered through a menu. The menu items to select each mode may be accessed from the Calendar's widgetMap. The name is created from the mode name plus 'ShowMenuItem', so the menu item to show the week mode would be accessed by myCalendar.widgetMap.weekShowMenuItem

The ModeSelector is part of the Calendar's default toolbar. It can be configured through the tbar config:

const calendar = new Calendar({
    tbar : {
        items : {
            modeSelector : {
                // Start in minified (menu) mode
                minified : true
            }
        }
    }
});

See also

  • tbar — The toolbar that contains this selector
  • modes — The modes available for selection
No results

Configs

Configs are options you supply in a configuration object when creating an instance of this class
  • The button or button config object that will display a popup menu to select the calendar mode.

  • The button group or button group config object that will display the calendar modes, one per button.

  • Set to true to present this widget in its minimal form.

  • The config property that will be used as the readable title for each mode.

Properties

Properties are getters/setters or publicly accessible variables on this class
type: calendarModeSelector

Source path

Calendar/widget/ModeSelector.js

Contents