| <style> |
| .full button span { |
| background-color: limegreen; |
| border-radius: 32px; |
| color: black; |
| } |
| .partially button span { |
| background-color: orange; |
| border-radius: 32px; |
| color: black; |
| } |
| </style> |
| <div ng-controller="DatepickerPopupDemoCtrl"> |
| <pre>Selected date is: <em>{{dt | date:'fullDate' }}</em></pre> |
| |
| <h4>Popup</h4> |
| <div class="row"> |
| <div class="col-md-6"> |
| <p class="input-group"> |
| <input type="text" class="form-control" uib-datepicker-popup="{{format}}" ng-model="dt" is-open="popup1.opened" datepicker-options="dateOptions" ng-required="true" close-text="Close" alt-input-formats="altInputFormats" /> |
| <span class="input-group-btn"> |
| <button type="button" class="btn btn-default" ng-click="open1()"><i class="glyphicon glyphicon-calendar"></i></button> |
| </span> |
| </p> |
| </div> |
| |
| <div class="col-md-6"> |
| <p class="input-group"> |
| <input type="text" class="form-control" uib-datepicker-popup ng-model="dt" is-open="popup2.opened" datepicker-options="dateOptions" ng-required="true" close-text="Close" /> |
| <span class="input-group-btn"> |
| <button type="button" class="btn btn-default" ng-click="open2()"><i class="glyphicon glyphicon-calendar"></i></button> |
| </span> |
| </p> |
| </div> |
| </div> |
| <div class="row"> |
| <div class="col-md-6"> |
| <label>Format: <span class="muted-text">(manual alternate <em>{{altInputFormats[0]}}</em>)</span></label> <select class="form-control" ng-model="format" ng-options="f for f in formats"><option></option></select> |
| </div> |
| </div> |
| |
| <hr /> |
| <button type="button" class="btn btn-sm btn-info" ng-click="today()">Today</button> |
| <button type="button" class="btn btn-sm btn-default" ng-click="setDate(2009, 7, 24)">2009-08-24</button> |
| <button type="button" class="btn btn-sm btn-danger" ng-click="clear()">Clear</button> |
| <button type="button" class="btn btn-sm btn-default" ng-click="toggleMin()" uib-tooltip="After today restriction">Min date</button> |
| </div> |