PeriodSelector displays date input fields and predefined period buttons.

### Properties

Property | Type | Default | Description
--- | --- | --- | ---
dateFormat | String | DD-MM-YYYY | Date format of date input fields. Check this page for possible codes. Note, only numeric date formats are allowed, so don't use MMM or MMMM month format. Please note that two-digit years (YY) is NOT supported in this setting.
fromText | String | From: | Text displayed next to "from" date input field.
hideOutOfScopePeriods | Boolean | true | Specifies if period buttons with date range bigger than available data should be hidden.
inputFieldsEnabled | Boolean | true | Specifies whether period selector displays "from" and "to" date input fields.
inputFieldWidth | Number | 100 | Width of date input fields, in pixels. Works only if period selector is horizontal.
listeners | Array[Object] |  | You can add listeners of events using this property. Example: listeners = [{"event":"changed", "method":handleEvent}];

periods

Array[Object]

Array of predefined period objects. Period object has 4 properties - period, count, label and selected. Possible period values are: "ss" - seconds, "mm" - minutes, "hh" - hours, "DD" - days, "MM" - months and "YYYY" - years. property "count" specifies how many periods this button will select. "label" will be displayed on a button and "selected" is a boolean which specifies if this button is selected when chart is initialized or not. Example: {period:"DD", count:10, label:"10 days", selected:false}.

periodsText | String | Zoom: | Text displayed next to predefined period buttons.
position | String | bottom | Possible values: "right", "left", "top", "bottom".
selectFromStart | Boolean | false | Specifies whether predefined period buttons should select a period from the beginning or the end of the data.
toText | String | To: | Text displayed next to "to" date input field.
width | Number | 180 | Width of a period selector, when position is "left" or "right".

### Methods

Name | Parameters | Returns | Description
--- | --- | --- | ---
addListener(type, handler) | type - string like 'changed' (listed in 'events' section of this class). handler - function which is called when event happens |  |
removeListener(obj, type, handler) |  |  |
setDefaultPeriod() |  |  | Resets the chart zoom to whatever default PeriodSelector button is. Can be used to simulate a click on period buttons buy changing "selected" property of PeriodSelector.periods items.

### Events

Name | Event object | Description
--- | --- | ---
changed | {type:"changed", startDate:Date, endDate:Date, predefinedPeriod:periodString, count:Number, event:MouseEvent} | Dispatched when dates in period selector input fields are changed or user clicks on one of the predefined period buttons.