angularjs-bootstrap-datetimepicker
Version:
This directive allows you to add a datetime-picker to your form elements.
39 lines (38 loc) • 2.2 kB
HTML
<div class="datetimepicker table-responsive">
<table class="table table-condensed {{ data.currentView }}-view">
<thead>
<tr>
<th class="left"
data-ng-click="changeView(data.currentView, data.leftDate, $event)"
data-ng-show="data.leftDate.selectable"><i class="glyphicon glyphicon-arrow-left"><span class="sr-only">{{ screenReader.previous }}</span></i>
</th>
<th class="switch"
colspan="5"
data-ng-show="data.previousViewDate.selectable"
data-ng-click="changeView(data.previousView, data.previousViewDate, $event)">{{ data.previousViewDate.display }}</th>
<th class="right" data-ng-click="changeView(data.currentView, data.rightDate, $event)"
data-ng-show="data.rightDate.selectable"><i class="glyphicon glyphicon-arrow-right"><span
class="sr-only">{{ screenReader.next }}</span></i>
</th>
</tr>
<tr>
<th class="dow" data-ng-repeat="day in data.dayNames">{{ day }}</th>
</tr>
</thead>
<tbody>
<tr data-ng-if="data.currentView !== 'day'">
<td colspan="7">
<span class="{{ data.currentView }}"
data-ng-repeat="dateObject in data.dates"
data-ng-class="{current: dateObject.current, active: dateObject.active, past: dateObject.past, future: dateObject.future, disabled: !dateObject.selectable}"
data-ng-click="changeView(data.nextView, dateObject, $event)">{{ dateObject.display }}</span></td>
</tr>
<tr data-ng-if="data.currentView === 'day'" data-ng-repeat="week in data.weeks">
<td data-ng-repeat="dateObject in week.dates"
data-ng-click="changeView(data.nextView, dateObject, $event)"
class="day"
data-ng-class="{current: dateObject.current, active: dateObject.active, past: dateObject.past, future: dateObject.future, disabled: !dateObject.selectable}">{{ dateObject.display }}</td>
</tr>
</tbody>
</table>
</div>