Search Posts

Category: angular-ui-bootstrap

AngularJS uibModal is invisible

I created a uibModal that should open when a button is pressed. And as far as I can see in the browser Inspector it opens. The problem is, it is invisible. If I change the .fade opacity through the Browser from 0 to 1 the Modal is displayed. But that does not help me for my code. in the index.html I have following included. <link rel=”stylesheet” href=”css/bootstrap.css”> <script src=”bower_components/angular/angular.js”></script> <script src=”bower_components/angular-route/angular-route.js”></script> <script src=”bower_components/angular-animate/angular-animate.js”></script> <script src=”bower_components/angular-bootstrap/ui-bootstrap-tpls.js”></script> […]

Clickable uib-accordion with search filter

I’ve encounter a problem when trying to search inside the uib-accordion with search filter so that it’s status changes to open and at the same time if search is empty user could click the header to open the content. All solutions I’ve found gives only one option. Here is what I’m doing as written in solutions – <div class=”input-group”> <input class=”form-control” ng-model=”searchText” placeholder=”Search” type=”search”/> <span class=”input-group-addon”><span class=”glyphicon glyphicon-search”></span></span> </div> <div class=”settings-tab”> <uib-accordion> <div ng-repeat=”item […]

Browser back button is not working in Springboot project

I created a project that contains some popup.I can close the popup via $uibModalInstance.dismiss(‘cancel’).It is working on all my pages.But When i want to close the popup via browser back button,the popup is not closed.I noticed when i click the browser back button, run function is working. function run(stateHandler,$uidModalStack,$rootScope){ $rootScope.$on(‘stateChangeStart’,function(event){ //to do } } I cannot use $uibModalInstance.dismiss(‘cancel’) or something like that($uidModalStack).Do you have any idea?` Source: AngularJS

select button ng model value undefined inside ng if

i have a problem,i cant get value from ng-model inside ng-if. if i alert the model the result is undefined. here is my html file <div class=”col-sm-2″> <select class=”form-control” ng-model=”yayaya”> <option value=”1″>yeyeyeye</option> </select> </div> <div class=”col-sm-2″ ng-if=”yayaya ===’1′”> <select class=”form-control” ng-model=”yoyoyo”> <option value=”bla”>blabla</option> </select> </div> this is the result when i alert the ng-model Source: AngularJS

Making tooltip on click in angularjs

I am struggling with making tooltip on click in angularjs. this is what I have now bus it is still working on hover: JS module: .config([‘$uibTooltipProvider’, function($uibTooltipProvider){ $uibTooltipProvider.setTriggers({ ‘click’: ‘click’, }); $uibTooltipProvider.options({ ‘placement’: ‘right’ }); }]) (I think the module is set correctly since placement part works and reacts to the changes in JS file). HTML: <div> <i class=”fa fa-info-circle fa-lg” style=”color:#26a6d1″ uib-tooltip=”tooltip text” tooltip-placement=”right” tooltip-trigger=”click” > </i> </div> CSS: .tooltip > .tooltip-arrow { visibility: […]

ng-click is not working in ui-bootstrap popover

<div ng-repeat = “offer in productOffers”> <div class = “col-md-12 col-xs-12 text-left mrg-5 selr-name” uib-popover-html = “‘<img src=assets/images/cart-blue.png class=img-cart ng-click=addProductToCart(offer,finalProduct)/> <div class=fonts-13 ng-click=addProductToCart(offer,finalProduct)> Add To Cart </div>'”> </div> </div> Here, I have added my code, I want to use ng-click inside popover element and I have ng-repeat for popover, so neeed to add popover HTML inline. ng-click is not working inside popover. Plunker Link Thanks in advance. Any help on this highly appreciated. Source: AngularJS

ui-bootstrap datepicker is not working in mozilla?

Using angular-ui-bootstrap, setting default startDate in a form. It is working fine in chrome, but not in Mozilla. Any suggestions please… index.html <input type=”text” ng-model=”params.startDate” class=”form-control-contract” placeholder = “Start Date” datepicker-popup=”{{format}}” is-open=”datePicker[$index].startDate” show-button-bar = false show-weeks=false required readonly name = ‘startDate’ max-date = “params.endDate”> js $scope.startDate = function($event,$index){ $event.preventDefault(); $event.stopPropagation(); $timeout( function(){ $scope.datePicker[$index] = {‘startDate’ : true}; }, 50); }; Source: AngularJS

form.$invalid is not working for angular ui date picker

i have two fields due date and a text filed enter a number due date which is a date picker ,either we can select date from date picker or we can set date by entering number in second text field. button create will be enabled if i manually set the date field from date picker but but it is not enabling if i set date picker value by entering text field can anybody tell me […]

AngularJS accordion that does not work, need to add bootstrap Collapse to it

I’ve had this issue for some time, but I can not figure out how to make a data driven accordion element that acts like one. I got it to expand, but I can’t collapse it. I have an older version of angular and I would like to use bootstrap 3. Here is my HTML: <div class=”my-lists-accordion” ng-if=”item.itemAccordion”> <ul class= accordion> <li ng-repeat=”itemAccordion in item.itemAccordion” ng click=”$parent.accordion.current = itemAccordion.itemName”> {{ itemAccordion.itemName }} <ul ng-show=”accordion.current == itemAccordion.itemName”> […]

Next Page »