Security News
tea.xyz Spam Plagues npm and RubyGems Package Registries
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
ember-cli-bootstrap-datetimepicker
Advanced tools
Readme
Date and time picker addon based on bootstrap. It uses bootstrap-datetimepicker and moment.js.
ember install ember-cli-bootstrap-datetimepicker
For demonstration see bootstrap-datetimepicker
Basic example:
{{bs-datetimepicker date=myDate}}
Returns: date
, null
Fired when the date is changed.
{{bs-datetimepicker change=(action onChange)}}
Returns: null
Fired when the date picker is hidden.
{{bs-datetimepicker hide=(action onHide)}}
Returns: null
Fired when the date picker is shown.
{{bs-datetimepicker show=(action onShow)}}
Default: false
Accepts: boolean
{{bs-datetimepicker date=myDate allowInputToggle=true}}
If true
, the picker will show on textbox focus and icon click when used in a button group.
Default: false
Accepts: boolean
{{bs-datetimepicker date=myDate calendarWeeks=true}}
Shows the week of the year to the left of first day of the week.
Default: null
Accepts: date
, moment
, string
{{bs-datetimepicker date=myDate}}
Sets the picker date/time.
Default: []
Accepts: array
of [number
]
{{bs-datetimepicker daysOfWeekDisabled=daysOfWeekDisabled}}
Disables selection of days in the array, e.g. sundays.
Default: false
Accepts: boolean
{{bs-datetimepicker disabled=disabled}}
Disables the input element.
Default: false
Accepts: array
of [date
, moment
, string
]
{{bs-datetimepicker disabledDates=disabledDates}}
{{bs-datetimepicker enabledDates=enabledDates}}
Disables / enables selection of dates in the array, e.g. holidays.
When updating the value, the array should be of type date
.
Default: false
Accepts: array
of [number
]
{{bs-datetimepicker date=myDate disabledHours=disabledHours}}
{{bs-datetimepicker date=myDate enabledHours=enabledHours}}
Disables / enables selection of hours in the array, affecting all days.
Default: false
Accepts: array
of [string
]
{{bs-datetimepicker date=myDate extraFormats=extraFormats}}
Allows for several input formats to be valid. Accepts an array of valid input moment format options.
Default: true
Accepts: boolean
{{bs-datetimepicker date=myDate focusOnShow=false}}
If false
, the textbox will not be given focus when the picker is shown.
Default: false
Accepts: string
{{bs-datetimepicker date=myDate format='MM/DD/YYYY'}}
See momentjs' docs for valid formats. Format also dictates what components are shown, e.g. MM/dd/YYYY
will not display the time picker.
Defaults: component defaults
'ember-cli-bootstrap-datetimepicker': {
icons: {
next: 'chevron right',
previous: 'chevron left'
}
}
Replaces icon classes globally.
Supported icons include clear
, close
, date
, down
, next
, previous
, time
, today
and up
.
If inner html has to be set (Material Icons), use ::after
pseudo selector.
Note: When using only the time picker, pass isTime=true
so that the correct icon is displayed.
Defaults: component defaults
{{bs-datetimepicker inline=true}}
Default: moment.locale()
Accepts: string
, moment.local('locale')
{{bs-datetimepicker date=myDate locale='de'}}
Use the specified locale for text rendering.
Note: When using localization, add includeLocales
to config/environment.js
.
Cherry pick locales (optimal)
moment: {
includeLocales: ['de', 'fr']
}
Include all locales
moment: {
includeLocales: true
}
Default: false
Accepts: date
, moment
, string
{{bs-datetimepicker date=myDate maxDate=myMaxDate}}
Prevents date/time selections after this date.
Default: false
Accepts: date
, moment
, string
{{bs-datetimepicker date=myDate minDate=myMinDate}}
Prevents date/time selections before this date.
Default: false
Accepts: boolean
{{bs-datetimepicker date=myDate openOnFocus=true}}
Opens the picker on input focus.
Default: false
Accepts: boolean
{{bs-datetimepicker date=myDate showClear=true}}
Show the Clear button in the icon toolbar.
Clicking the Clear button will set the calendar to null
.
Default: false
Accepts: boolean
{{bs-datetimepicker date=myDate showClose=true}}
Show the Close button in the icon toolbar.
Clicking the Close button will call hide()
.
Default: false
Accepts: boolean
{{bs-datetimepicker date=myDate showTodayButton=true}}
Show the Today button in the icon toolbar.
Clicking the Today button will set the calendar view and set the date to now
.
Default: false
Accepts: boolean
{{bs-datetimepicker date=myDate sideBySide=true}}
Show calendar and time side by side.
Default: ''
Accepts: string
{{bs-datetimepicker date=myDate timeZone='Europe/Berlin'}}
Set timezone.
Default: { today: 'Go to today', clear: 'Clear selection', close: 'Close the picker', selectMonth: 'Select Month', prevMonth: 'Previous Month', nextMonth: 'Next Month', selectYear: 'Select Year', prevYear: 'Previous Year', nextYear: 'Next Year', selectDecade: 'Select Decade', prevDecade: 'Previous Decade', nextDecade: 'Next Decade', prevCentury: 'Previous Century', nextCentury: 'Next Century', pickHour: 'Pick Hour', incrementHour: 'Increment Hour', decrementHour: 'Decrement Hour', pickMinute: 'Pick Minute', incrementMinute: 'Increment Minute', decrementMinute: 'Decrement Minute', pickSecond: 'Pick Second', incrementSecond: 'Increment Second', decrementSecond: 'Decrement Second', togglePeriod: 'Toggle Period', selectTime: 'Select Time' }
Accepts: object
with one or all of the parameters above
{{bs-datetimepicker date=myDate tooltips=tooltips}}
Default: false
Accepts: boolean
, 'year', 'month', 'day', 'hour', 'minute'
{{bs-datetimepicker date=myDate useCurrent='day'}}
If the date is not set, the first time the widget opens will set the date
to current moment (if true
). Granularity can be specified as a string
.
Default: false
Accepts: date
, moment
, string
{{bs-datetimepicker date=myDate viewDate=customDate}}
Pre-set the date / time, allowing to change default time from 12:00 AM.
Default: days
Accepts: 'years', 'months', 'days'
{{bs-datetimepicker date=myDate viewMode=false}}
The default view to display when the picker is shown.
Note: To limit the picker to selecting, for instance the year and month, use format: MM/YYYY
.
Default: null
Accepts: string or jQuery object
{{bs-datetimepicker date=myDate widgetParent='#an-element-id'}}
On picker show, places the widget at the identifier (string) or jQuery object if the element has css position: 'relative'.
Default: { horizontal: 'auto', vertical: 'auto' }
Accepts: object
with one or all of the parameters above
(horizontal: 'auto', 'left', 'right' / vertical: 'auto', 'top', 'bottom')
{{bs-datetimepicker date=myDate widgetPositioning=widgetPositioning}}
Will position widget according to the parameters given in object.
Default: true
Accepts: boolean
{{bs-datetimepicker date=myDate showIcon=false}}
Show calendar or time icon after input.
FAQs
Date and time picker component for Ember CLI based on bootstrap-datetimepicker.
The npm package ember-cli-bootstrap-datetimepicker receives a total of 940 weekly downloads. As such, ember-cli-bootstrap-datetimepicker popularity was classified as not popular.
We found that ember-cli-bootstrap-datetimepicker demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.