Added date and date time picker.
This commit is contained in:
parent
ed1de38ce7
commit
35235b7653
2 changed files with 38 additions and 4 deletions
|
@ -1500,10 +1500,27 @@ class InputsRef extends App.ControllerContent
|
||||||
@$('.searchableAjaxSelectPlaceholder').replaceWith( searchableAjaxSelectObject.element() )
|
@$('.searchableAjaxSelectPlaceholder').replaceWith( searchableAjaxSelectObject.element() )
|
||||||
|
|
||||||
# time and timeframe
|
# time and timeframe
|
||||||
@$('.time').timepicker()
|
@$('.js-timepicker1, .js-timepicker2').timepicker()
|
||||||
|
|
||||||
@$('.timeframe').timepicker
|
@$('.timeframe').timepicker(
|
||||||
maxHours: 99
|
maxHours: 99
|
||||||
|
)
|
||||||
|
|
||||||
|
# date picker
|
||||||
|
@$('.js-datepicker3').datepicker(
|
||||||
|
todayHighlight: true
|
||||||
|
startDate: new Date().toLocaleDateString('de-DE') # returns 25.09.2015
|
||||||
|
format: 'dd.mm.yyyy',
|
||||||
|
container: @$('.js-datepicker3').parent()
|
||||||
|
)
|
||||||
|
|
||||||
|
# date time picker
|
||||||
|
@$('.js-datepicker4').datepicker(
|
||||||
|
todayHighlight: true
|
||||||
|
startDate: new Date().toLocaleDateString('en-US') # returns 9/25/2015
|
||||||
|
container: @$('.js-datepicker4').parent()
|
||||||
|
)
|
||||||
|
@$('.js-timepicker4').timepicker()
|
||||||
|
|
||||||
App.Config.set( 'layout_ref/inputs', InputsRef, 'Routes' )
|
App.Config.set( 'layout_ref/inputs', InputsRef, 'Routes' )
|
||||||
|
|
||||||
|
|
|
@ -4,9 +4,26 @@
|
||||||
<div style="max-width: 500px">
|
<div style="max-width: 500px">
|
||||||
<h2>Time</h2>
|
<h2>Time</h2>
|
||||||
<p>A time of the day</p>
|
<p>A time of the day</p>
|
||||||
<input type="text" value="14:40" class="time">
|
<input type="text" value="14:40" class="time js-timepicker1">
|
||||||
|
|
||||||
<p>Add class <code>time--12</code> to activate AM/PM support</p>
|
<p>Add class <code>time--12</code> to activate AM/PM support</p>
|
||||||
<input type="text" value="2:40 PM" class="time time--12">
|
<input type="text" value="2:40 PM" class="time time--12 js-timepicker2">
|
||||||
|
|
||||||
|
<p>A date</p>
|
||||||
|
<div class="date form-group">
|
||||||
|
<div class="controls">
|
||||||
|
<input type="text" value="10/28/2015" class="form-control js-datepicker3">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p>A date time</p>
|
||||||
|
<div class="date form-group formGroup--bundle">
|
||||||
|
<div class="controls">
|
||||||
|
<input type="text" value="10/28/2015" class="form-control js-datepicker4">
|
||||||
|
<div class="controls-label">at</div>
|
||||||
|
<input type="text" value="08:00" class="form-control time js-timepicker4">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h2>Timeframe</h2>
|
<h2>Timeframe</h2>
|
||||||
<p>A time between 00:00 and 99:99 hours</p>
|
<p>A time between 00:00 and 99:99 hours</p>
|
||||||
|
|
Loading…
Reference in a new issue