how to popup window using angularjs - angularjs

Question

I want a dialog comes up on a button click and ask for two dates to enter and give me days difference back on my page on a label using angularjs. Can anyone help me on this?

Answer 1

This is an excellent solution for Bootstrap 3, Angular UI and Modal dialogs.
http://codepen.io/m-e-conroy/pen/ALsdF

Answer 2

I tried using #user3360944 example and it works for me, How can I select multiple items from the popup and add it to a table on the parent page? Here is my code
Parent Template : Mainpage.html
<div ng-controller="ItemCtrl" class="modal-body">
<button class="btn btn-default" ng-click="open();">Open Dialog</button>
<div ng-show="selected">{{ selected.Name}}</div>
</div>
Popup Template : ItemSelectDlg.html
<table class="table table-hover grid">
<thead class="tableheader">
<tr>
<th>Name</th>
<th>Type</th>
<th>Payment</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in items" ng-click="selected.item = item">
<td>{{item.Name}}</td>
<td>{{item.Type}}</td>
<td>{{item.Payment}}</td>
</tr>
</tbody>
</table>
Selected:
<b>{{ selected.item.Name }} </b>
<div class="modal-footer">
<button class="btn btn-primary" ng-click="ok()">OK</button>
<button class="btn btn-warning" ng-click="cancel()">Cancel</button>
</div>
Script code :ItemCtrl
$scope.items = $scope.ProductSet[0].Items;
$scope.open = function () {
var modalInstance = $modal.open({
templateUrl:'ItemSelectDlg.html',
controller: ModalInstanceCtrl,
resolve: {
items: function () {
return $scope.items;
}
}
});
modalInstance.result.then(function (selectedItem) {
$scope.selected = selectedItem;
}, function () {
//cancel
});
};
var ModalInstanceCtrl = function ($scope, $modalInstance, items) {
$scope.items = items;
$scope.selected = {
item: $scope.items[0]
};
$scope.ok = function () {
$modalInstance.close($scope.selected.item);
};
$scope.cancel = function () {
$modalInstance.dismiss('cancel');
};
};