Skip to content
This repository was archived by the owner on Dec 26, 2019. It is now read-only.

Commit 013d947

Browse files
committed
Added description of all options based on bootstrap-datepicker docs
1 parent c15a56d commit 013d947

File tree

1 file changed

+72
-5
lines changed

1 file changed

+72
-5
lines changed

README.md

Lines changed: 72 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -45,12 +45,18 @@ Use separate component for inline mode:
4545
{{bootstrap-datepicker-inline value=expiresAt}}
4646
```
4747

48-
The component supports many options of the bootstrap-datepicker library. Let me show you how to use them :sparkles:
48+
The component supports many options of the bootstrap-datepicker library. Feel free to take a look into
49+
[bootstrap-datepicker docs on Read the Docs](https://bootstrap-datepicker.readthedocs.io/en/latest/) for more
50+
in-depth information.
51+
52+
Let me show you how to use them :sparkles:
4953

5054
### Available options
5155

5256
#### autoclose
5357

58+
Whether or not to close the datepicker immediately when a date is selected.
59+
5460
Type: `Boolean`
5561
Default: `false`
5662

@@ -60,6 +66,8 @@ Default: `false`
6066

6167
#### calendarWeeks
6268

69+
Whether or not to show week numbers to the left of week rows.
70+
6371
Type: `Boolean`
6472
Default: `false`
6573

@@ -69,6 +77,9 @@ Default: `false`
6977

7078
#### clearBtn
7179

80+
If true, displays a “Clear” button at the bottom of the datepicker to clear the input value. If “autoclose” is also
81+
set to true, this button will also close the datepicker.
82+
7283
Type: `Boolean`
7384
Default: `false`
7485

@@ -78,6 +89,8 @@ Default: `false`
7889

7990
#### datesDisabled
8091

92+
Array of date strings or a single date string formatted in the given date format
93+
8194
Type: `Array` or `String`
8295
Default: `""` or `[]`
8396

@@ -87,6 +100,9 @@ Default: `""` or `[]`
87100

88101
#### daysOfWeekDisabled
89102

103+
Days of the week that should be disabled. Values are 0 (Sunday) to 6 (Saturday). Multiple values should be
104+
comma-separated. Example: disable weekends: `'06'` or `'0,6'` or `[0,6]`.
105+
90106
Type: `Array` or `String`
91107
Default: `""` or `[]`
92108

@@ -96,6 +112,8 @@ Default: `""` or `[]`
96112

97113
#### endDate
98114

115+
The latest date that may be selected; all later dates will be disabled.
116+
99117
Type: `Date` or `String`
100118
Default: `Infinity` (end of time)
101119

@@ -105,6 +123,10 @@ Default: `Infinity` (end of time)
105123

106124
#### forceParse
107125

126+
Whether or not to force parsing of the input value when the picker is closed. That is, when an invalid date
127+
is left in the input field by the user, the picker will forcibly parse that value, and set the input’s value
128+
to the new, valid date, conforming to the given format.
129+
108130
Type: `Boolean`
109131
Default: `true`
110132

@@ -114,6 +136,14 @@ Default: `true`
114136

115137
#### format
116138

139+
The date format, combination of d, dd, D, DD, m, mm, M, MM, yy, yyyy.
140+
141+
* d, dd: Numeric date, no leading zero and leading zero, respectively. Eg, 5, 05.
142+
* D, DD: Abbreviated and full weekday names, respectively. Eg, Mon, Monday.
143+
* m, mm: Numeric month, no leading zero and leading zero, respectively. Eg, 7, 07.
144+
* M, MM: Abbreviated and full month names, respectively. Eg, Jan, January
145+
* yy, yyyy: 2- and 4-digit years, respectively. Eg, 12, 2012.
146+
117147
Type: `String`
118148
Default: `'mm/dd/yyyy'`
119149

@@ -123,6 +153,8 @@ Default: `'mm/dd/yyyy'`
123153

124154
#### keyboardNavigation
125155

156+
Whether or not to allow date navigation by arrow keys.
157+
126158
Type: `Boolean`
127159
Default: `true`
128160

@@ -132,22 +164,34 @@ Default: `true`
132164

133165
#### language
134166

135-
Type: `String`
136-
Default: `'en'`
167+
The IETF code (eg “en” for English, “pt-BR” for Brazilian Portuguese) of the language to use for month and day
168+
names. These will also be used as the input’s value (and subsequently sent to the server in the case of form
169+
submissions). If a full code (eg “de-DE”) is supplied the picker will first check for an “de-DE” language and
170+
if not found will fallback and check for a “de” language. If an unknown language code is given, English will
171+
be used.
137172

138173
When you need another language, you should import a locale file using your Brocfile.js. Just import `bower_components/bootstrap-datepicker/js/locales/bootstrap-datepicker.<LANGUAGE_CODE>.js`, e.g.:
139174

140175
```javascript
141176
// Brocfile.js
142177
app.import('bower_components/bootstrap-datepicker/js/locales/bootstrap-datepicker.de.js');
143178
```
179+
180+
Type: `String`
181+
Default: `'en'`
182+
144183
```handlebars
145184
{{! somewhere in template }}
146185
{{bootstrap-datepicker value=expiresAt language="de"}}
147186
```
148187

149188
#### minViewMode
150189

190+
Set a minimum limit for the view mode. Accepts: “days” or 0, “months” or 1, “years” or 2, “decades” or 3, and
191+
“centuries” or 4. Gives the ability to pick only a month, a year or a decade. The day is set to the 1st for “months”,
192+
and the month is set to January for “years”, the year is set to the first year from the decade for “decades”, and
193+
the year is set to the first from the millennium for “centuries”.
194+
151195
Type: `Number` or `String`
152196
Default: `0` or `'days'`
153197

@@ -157,6 +201,17 @@ Default: `0` or `'days'`
157201

158202
#### orientation
159203

204+
A space-separated string consisting of one or two of “left” or “right”, “top” or “bottom”, and “auto” (may be
205+
omitted); for example, “top left”, “bottom” (horizontal orientation will default to “auto”), “right” (vertical
206+
orientation will default to “auto”), “auto top”. Allows for fixed placement of the picker popup.
207+
208+
“orientation” refers to the location of the picker popup’s “anchor”; you can also think of it as the location of
209+
the trigger element (input, component, etc) relative to the picker.
210+
211+
“auto” triggers “smart orientation” of the picker. Horizontal orientation will default to “left” and left offset
212+
will be tweaked to keep the picker inside the browser viewport; vertical orientation will simply choose “top” or
213+
“bottom”, whichever will show more of the picker in the viewport.
214+
160215
Type: `String`
161216
Default: `'auto'`
162217

@@ -166,6 +221,8 @@ Default: `'auto'`
166221

167222
#### startDate
168223

224+
The earliest date that may be selected; all earlier dates will be disabled.
225+
169226
Type: `Date` or `String`
170227
Default: `-Infinity` (beginning of time)
171228

@@ -175,6 +232,10 @@ Default: `-Infinity` (beginning of time)
175232

176233
#### startView
177234

235+
The view that the datepicker should show when it is opened. Accepts values of 0 or “month” for month view (the
236+
default), 1 or “year” for the 12-month overview, 2 or “decade” for the 10-year overview, 3 or “century” for the
237+
10-decade overview, and 4 or “millennium” for the 10-century overview. Useful for date-of-birth datepickers.
238+
178239
Type: `Number` or `String`
179240
Default: `0` or `'month'`
180241

@@ -184,17 +245,21 @@ Default: `0` or `'month'`
184245

185246
#### todayBtn
186247

248+
If true or “linked”, displays a “Today” button at the bottom of the datepicker to select the current date.
249+
If true, the “Today” button will only move the current date into view; if “linked”, the current date will
250+
also be selected.
251+
187252
Type: `Boolean` or `String`
188253
Default: `false`
189254

190-
> If true or “linked”, displays a “Today” button at the bottom of the datepicker to select the current date. If true, the “Today” button will only move the current date into view; if “linked”, the current date will also be selected. [More...](http://bootstrap-datepicker.readthedocs.org/en/latest/options.html#todaybtn)
191-
192255
```handlebars
193256
{{bootstrap-datepicker value=expiresAt todayBtn=true}}
194257
```
195258

196259
#### todayHighlight
197260

261+
If true, highlights the current date.
262+
198263
Type: `Boolean`
199264
Default: `false`
200265

@@ -204,6 +269,8 @@ Default: `false`
204269

205270
#### weekStart
206271

272+
Day of the week start. 0 (Sunday) to 6 (Saturday)
273+
207274
Type: `Number`
208275
Default: `0` (Sunday)
209276

0 commit comments

Comments
 (0)