Mojo.Widget.TimePicker

Namespace Detail

Overview

The TimePicker offers selection of the hour and minutes with an AM/PM selector when appropriate. It is one of the simple picker widgets that present their choices as a linear sequence of values that wraps around; when you scroll to the end of the sequence, it simply continues back at the beginning. The Date and Time pickers use the JavaScript Date object to represent the chosen time in their data model.

Declaration

<div x-mojo-element="TimePicker" id="timepickerId" class="timepickerClass"
  name="timepickerName"></div>

Properties	Required	Value	Description
x-mojo-element	Required	TimePicker	Declares the widget as type 'TimePicker'.
id	Required	Any String	Identifies the widget element for use when instantiating or rendering.
class	Optional	Any String	There is no default class for TimePicker, but you can assign one if you want to apply custom styling.
name	Optional	Any String	Adds a unique name to the TimePicker widget; generally used in templates.

Events

this.controller.listen(this.controller.get("timepickerId"),
  Mojo.Event.propertyChange', this.handleUpdate);

Event Type	Value	Event Handling
Mojo.Event.propertyChange	event.value or model.time	Respond to TimePicker value change.

Instantiation

var currentTime = new Date();this.controller.setupWidget("timepickerId",
  this.attributes = {
      label: 'Time',
      modelProperty: 'time'
  },
  this.model = {
      time: currentTime
  }
); 

Attribute Properties

Attribute Property	Type	Required	Default	Description
label	String	Optional	'Time'	Label displayed for the widget controls
labelPlacement	String	Optional	Mojo.Widget.labelPlacementLeft	Mojo.Widget.labelPlacementRight: places label on right, value on left Mojo.Widget.labelPlacementLeft: places label on left, value on right
modelProperty	String	Optional	time	Model property name for date object
minuteInterval	Integer	Optional	5	Interval between minute selection options

Model Properties

Model Property	Type	Required	Default	Description
time	Date Object	Required	null	Date object to set initial widget value and updated value after user selection

Methods

The TimePicker widget has no methods.