angular-eonasdan-datetimepicker
Version:
A wrapper directive around the bootstrap-datetimepicker component.
70 lines (62 loc) • 2.76 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<title>angular-eonasdan-datetimepicker</title>
<!-- libs -->
<link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="/node_modules/eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min.css">
<!-- end libs -->
</head>
<body ng-app="plunker">
<div ng-controller="controller as vm">
<div class="well">
<h3>Angular-eonasdan-datetimepicker</h3>
<a href="https://github.com/atais/angular-eonasdan-datetimepicker"><p style="margin: -10px 0 0 0;">
https://github.com/atais/angular-eonasdan-datetimepicker</p></a>
<br>
<div class="row">
<div class="col-md-3">
<div class="form-group">
<div class="input-group" datetimepicker
on-change="vm.optionsTo.minDate = vm.dateFrom"
ng-model="vm.dateFrom" options="vm.optionsFrom">
<input class="form-control"/>
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
<br>
<p><b>Input date:</b> {{vm.dateFrom.format() | date: 'yyyy/MM/dd'}}</p>
<p><b>Options:</b> {{vm.optionsFrom}}</p>
</div>
<div class="col-md-3">
<div class="form-group">
<div class="input-group" datetimepicker
on-change="vm.optionsFrom.maxDate = vm.dateTo"
ng-model="vm.dateTo" options="vm.optionsTo">
<input class="form-control"/>
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
<br>
<p><b>Input date:</b> {{vm.dateTo.format() | date: 'yyyy/MM/dd'}}</p>
<p><b>Options:</b> {{vm.optionsTo}}</p>
</div>
</div>
<button class="btn btn-default" ng-click="vm.print()">What's up?</button>
</div>
</div>
<!-- libs -->
<script src="/node_modules/moment/moment.js"></script>
<script src="/node_modules/jquery/dist/jquery.js"></script>
<script src="/node_modules/eonasdan-bootstrap-datetimepicker/src/js/bootstrap-datetimepicker.js"></script>
<script src="/node_modules/angular/angular.js"></script>
<!-- end libs -->
<script src="../dist/angular-eonasdan-datetimepicker.js"></script>
<script src="double.js"></script>
</body>
</html>