Date Picker
Using .date-picker, .date-picker-alt class in <input> element to enable datepicker.
We have used Bootstrap Datepicker for date picker, here you see full documentation here.
Date format
mm/dd/yyyyDate format
yyyy-mm-ddDate format
yyyy-mm-ddDate format
mm/dd/yyyyAdditionally you can use data-date-format="" attribute of <input> element to formate date. Default format mm/dd/yyyy.
Code Example
<div class="form-group">
<label class="form-label">Datepicker</label>
<div class="form-control-wrap">
<input type="text" class="form-control date-picker">
</div>
<div class="form-note">Date format <code>mm/dd/yyyy</code></div>
</div>
Date Range Picker
Use .date-picker-range and .input-daterange (must have) class in <div> element and Two <input> tag inside .date-picker-range to enable datepicker Range.
TO
Code Example
<div class="form-group">
<label class="form-label">Datepicker Range</label>
<div class="form-control-wrap">
<div class="input-daterange date-picker-range input-group">
<input type="text" class="form-control" />
<div class="input-group-addon">TO</div>
<input type="text" class="form-control" />
</div>
</div>
</div>
Time Picker
Using .time-picker class in <select> element to enable time picker.
We have used Bootstrap Timepicker for date picker, here you see full documentation here.
Additionally you can use some_thing_else attribute of <input> element.
Code Example
<div class="form-group">
<label class="form-label">Timepicker</label>
<div class="form-control-wrap">
<input type="text" class="form-control time-picker" placeholder="Input placeholder">
</div>
</div>
