Daterange
| Last update: | () |
| Message | feat(daterangepicker): overlay attribute |
| Committer: | Tamás Bíró |
| Version history | |
Default
Copy Jade
Copy HTML
Show code
Hide code
e-daterange
<e-daterange id="normal" start="2016-04-13" end="2016-04-20"></e-daterange>
<e-daterange id="normal" start="2016-04-13" end="2016-04-20"></e-daterange>
Inline
Copy Jade
Copy HTML
Show code
Hide code
[layout="inline"]
<e-daterange id="inline" layout="inline" start="2016-04-13" end="2016-04-20"></e-daterange>
<e-daterange id="inline" layout="inline" start="2016-04-13" end="2016-04-20"></e-daterange>
min-date, max-date
Copy Jade
Copy HTML
Show code
Hide code
min-date, max-date
<e-daterange id="inline" layout="inline" start="2016-04-15" end="2016-04-20" min-date="2016-04-15" max-date="2016-04-22"></e-daterange>
<e-daterange id="inline" layout="inline" start="2016-04-15" end="2016-04-20" min-date="2016-04-15" max-date="2016-04-22"></e-daterange>
disabled
Copy Jade
Copy HTML
Show code
Hide code
<e-daterange id="normal" start="2016-04-13" end="2016-04-20" disabled></e-daterange>
<e-daterange id="normal" start="2016-04-13" end="2016-04-20" disabled></e-daterange>
invalid
Copy Jade
Copy HTML
Show code
Hide code
<e-daterange id="normal" start="2016-04-13" end="2016-04-20" invalid></e-daterange>
<e-daterange id="normal" start="2016-04-13" end="2016-04-20" invalid></e-daterange>
inline
Copy Jade
Copy HTML
Show code
Hide code
<e-daterange id="normal" start="2016-04-13" end="2016-04-20" inline></e-daterange>
<e-daterange id="normal" start="2016-04-13" end="2016-04-20" inline></e-daterange>
inline and overlay
Copy Jade
Copy HTML
Show code
Hide code
<e-daterange id="normal" start="2016-04-13" end="2016-04-20" inline overlay></e-daterange>
<e-daterange id="normal" start="2016-04-13" end="2016-04-20" inline overlay></e-daterange>
API Reference
Properties
| Name | Description | Type | Required | Default value |
|---|---|---|---|---|
| layout | Layout type (inline or dropdown) | string | dropdown | |
| start | The start of the initially selected date range | string | ||
| end | The end of the initially selected date range | string | ||
| min-date | The earliest date a user may select | string | ||
| max-date | The latest date a user can select | string | ||
| locale | Sets the language of the component | string | en | |
| disabled | Disabled state | boolean | false | |
| invalid | Invalid state | boolean | false | |
| inline | Inline block version | boolean | false | |
| overlay | Show/hide overlay behind the picker in opened state | boolean | false |
Events
| Event | Description | Returns |
|---|---|---|
| update | Fires on every date change | detail: { start: { date: [as string], dateObj: [JavaScript date] }, end: { date: [as string], 'dateObj': [JavaScript date] } } |