Search Posts

Category: angular-bootstrap

How do I display Angular UI Bootstrap date picker on click?

I have an Angular app that uses Full Calendar. I have a Full Calendar custom button that when a user clicks, should open a Angular Bootstrap Datepicker. I’m currently toggling CSS visibility but for some reason, the date picker doesn’t display (after clicking the button) unless I resize the window. My template: <div id=”cal-go-to-date” ng-style=””> <div uib-datepicker ng-model=”goToDate.dt” class=”well well-sm” datepicker-options=”goToDate.options”></div> </div> My Angular controller: $scope.goToDate = { dt: new Date(), options: { datepickerMode: ‘month’, […]

close bootstrap accordion timing

I am trying to close bootstrap accordion on click using angularJS, I want my close in 5 second how to do it, Here is my code: <!DOCTYPE html> <html> <head> <meta name=”viewport” content=”width=device-width, initial-scale=1″> <link rel=”stylesheet” href=””> <script src=””></script> <script src=””></script> </head> <body> <div class=”container”> <h2>Collapsible Panel</h2> <p>Click on the collapsible panel to open and close it.</p> <div class=”panel-group”> <div class=”panel panel-default”> <div class=”panel-heading”> <h4 class=”panel-title”> <a data-toggle=”collapse” href=”#collapse1″>Collapsible panel</a> </h4> </div> <div id=”collapse1″ class=”panel-collapse […]

Show/Hide all with show/hide sections inside angularjs

I need to have an overall Show/Hide click to show or hide all the detail divs of a list of “panels” of data. Also within each panel, there is a Show/Hide click to individually show or hide that div of data. I think that if the overall show/hide is clicked that the individual click values should be set equal to overall value when clicked. That way if the individual ones are changed, they are all […]

Angular bootstrap modal inside a modal

How can I open a modal inside of a modal? Ive followed this plnkr but I got an error when I click the confirm button of the second modal. This is the error: Error: [$injector:unpr] This is my first modal $scope.edit = function(data) { var modalInstance = ${ templateUrl: “/wp-content/themes/copywriter-theme/angular-modal-template/management_modal.html”, controller: ‘managementModal’, resolve: { items: function() { return data; } } }); } This is my 2nd modal angular.module([‘ui.bootstrap’]).controller(‘managementModal’,[‘$scope’,’$http’,’$uibModalInstance’,’$uibModal’,’items’,function($scope, $http, $uibModalInstance, $uibModal, items){ $scope.names = […]