Tagged Questions
64
votes
13answers
41k views
How do I implement the bootstrap navbar active class with Angular JS
If I have a navbar in bootstrap with the items
Home | About | Contact
How do I set the active class for each menu item when they are active? That is, how can I set class="active" when the angular ...
44
votes
4answers
47k views
Bootstrap 3 compatible with current AngularJS bootstrap directives?
Will bootstrap 3 release be compatible with current AngularJS bootstrap directives?
I want to use Bootstrap 2.3.1 directive with AngularJS:
http://angular-ui.github.io/bootstrap/
With the Bootstrap ...
36
votes
7answers
15k views
Reconcile Angular.js and Bootstrap form validation styling
I am using Angular with Bootstrap. Here is the code for reference:
<form name="newUserForm" ng-submit="add()" class="" novalidate>
<input type="text" class="input" ...
36
votes
5answers
13k views
set the width of select2 input (through Angular-ui directive)
I have problem making this plunkr (select2 + angulat-ui) work.
http://plnkr.co/edit/NkdWUO?p=preview
In local setup, I get the select2 work, but I cannot set the width as described in the docs. It ...
30
votes
2answers
2k views
Don't the data attribute options used in Bootstrap, Angular.js, and Ember.js conflict with Unobtrusive Javascript principles? [closed]
I've always been told it's good practice (ala 'unobtrusive javascript') separate JavaScript from HTML markup. However, I've been seeing the opposite trend with a number of new and popular frameworks ...
21
votes
4answers
10k views
How would I use AngularJS ng-repeat with Twitter Bootstrap's scaffolding?
How would I use AngularJS ng-repeat to display the following HTML (Twitter Bootstrap Scaffolding)? Essentially, every third record I need to close the </div>, print an <hr>, then open ...
14
votes
2answers
10k views
Bootstrap “buttons-radio” toggle with AngularJS
I made a small angular module to integrate with the bootstrap "buttons-group" ('s plus a bit of javascript to make them work like radio buttons. I made it on this module to do the same for ...
13
votes
4answers
10k views
Twitter Boostrap Navbar with Angular JS - Collapse not functioning
I am using Angular and Twitter Bootstrap nav bar and trying to get the collapse functionality to work. Here is the code I am using:
Partial: program.html
<div class="navbar navbar-inverse ...
13
votes
3answers
12k views
Angular Dialog directives with Bootstrap 3
We're trying to migrate from Bootstrap 2.3.2 to Bootstrap 3 (RC1) and are having problems with the AngularJS Dialog directive. On clicking the relevant button no dialogue popup appears (the page ...
12
votes
2answers
13k views
Working example of AngularJS and Bootstrap DatePicker directive?
I've seen a variety of github directive examples, but none include a working JSFiddle and I've not been able to get any of them to work. Surprised this isn't in Angular-UI by this point.
12
votes
1answer
1k views
use angular-ui-router with bootstrap $modal to create a multi-step wizard
The FAQ for ui-router has a section about integration with bootstrap $modals, but it doesn't mention anything about abstract views. I have 3 views under a single abstract view, so something like the ...
11
votes
3answers
11k views
How to update and include Twitter Bootstrap 3 on webapp or yo angular?
I use yo webapp or yo angular to create new project, and I received Bootstrap include is version 2.3.2 but I want use Bootstrap last verison.
How can update Bootstrap package with command prompt and ...
11
votes
2answers
6k views
Should I use Angular UI Bootstrap or plain Bootstrap 3? [closed]
At time of writing Angular UI Bootstrap is based on Twitter Bootstrap 2 while the latest version is Bootstrap 3. If I were to write an application in Angular.js TODAY, what UI framework should I use? ...
10
votes
2answers
8k views
How to tell which bootstrap tab is selected in Angular-UI
Is there a way to tell which tab that has been selected when using the Bootstrap tabs in Angular UI?
I tried watching the panes array but it deosn't seem to be updated when switching tab. Can one ...
9
votes
2answers
8k views
The real (or hidden) difference/s between Twitter bootstrap and Angular.js
I've just been comparing these 2 frontend frameworks and from what I can tell, they seem to do the exact same thing in terms of providing the dev with an HTML, CSS and JS frontend.
Boostrap: Sleek, ...
9
votes
3answers
11k views
angular.js conditional markup in ng-repeat
I'm using angular.js and (for the sake of argument) bootstrap. Now I need to iterate on "things" and display them in ''rows'' :
<div class="row">
<div class="span4">...</div>
...
8
votes
2answers
9k views
How to set Twitter Bootstrap class=error based on AngularJS input class=ng-invalid?
I have a problem where my CSS is not taking effect (in Chrome), and I think there is some conflict with Twitter Bootstrap.
input.ng-invalid {
border-color: red;
outline-color: red;
}
My ...
8
votes
2answers
6k views
twitter bootstrap popover doesn't work with angularjs
I was trying to use twitter bootstrap popover on my webpage when I discover that it doesn't work when it is placed below a <div> with ng-repeat. It works fine at the top within a div class that ...
8
votes
3answers
4k views
Angular.js using bootstrap and dynamically creating rows
I am trying to figure out how to dynamically create bootstrap row divs with a class of row-fluid with angular.js using the ng-repeat directive.
Here is the angular:
<div ng-repeat="task in ...
8
votes
2answers
1k views
Possible to install just Bootstrap CSS with Bower?
Starting a new Angular project via Yeoman asks if you want to include Twitter Bootstrap (I'm using Sass flavor). Doing so includes both the styles and scripts. However, I want to use UI Bootstrap ...
8
votes
1answer
2k views
jQuery syntax error: #/
I am currently using jQuery, Twitter Bootstrap and AngularJS for my web application. I've been trying to do routing, but jQuery keeps giving me Syntax error, unrecognized expression: #/time whenever I ...
8
votes
4answers
1k views
How to prevent redirecting <a href=“#something”> in Angular Js1.2
I was using AngularJs-1.7.0 and Bootstrap in my application. Recently I migrated from AngularJs-1.0.7 to AngularJs-1.2. I am using Bootstrap's Accordions and Tabs.
Html code for Tab contains <a ...
8
votes
2answers
7k views
AngularJS and Twitter Bootstrap themes (or alternative?)
We're looking to build an app with a bootstrap theme (e.g. https://wrapbootstrap.com/theme/smartadmin-responsive-webapp-WB0573SK0) so that we can get UI that looks nice without investing too much in ...
7
votes
4answers
11k views
Closing Twitter Bootstrap Modal From Angular Controller
I have a modal window that I use to present a form to users. They enter the information and then press a button the has an ng-click. The server processes the request and sends back a response. When ...
7
votes
2answers
15k views
Angularjs UI Modal Forms
I used to have a login dialog using bootstrap modal:
$scope.loginDialog = {
backdrop: true,
keyboard: true,
windowClass: "modal loginDialog",
backdropClick: true,
templateUrl: ...
7
votes
2answers
2k views
angular ui modal after close event
Is there a way I can call a function after a modal window got called (no matter if it happened with a button or by clicking on the backdrop)
var dialog, options;
options = {
windowClass: ...
7
votes
1answer
5k views
Html file as content in Bootstrap popover in AngularJS directive
I have an Angular directive to handle Bootstrap popovers as shown in the code below. In my directive I'm setting the popover content to a HTML string, which I think is ugly.
What I wanna do is to use ...
7
votes
2answers
4k views
Displaying dynamic data from AngularJS to Twitter Bootstrap Popover
I was attempting to get Bootstrap Popover to work with dynamic binded data in AngularJS with the AngularUI passthrough. In my fiddle i'm unable to dynamically show the title of office locations and ...
7
votes
4answers
5k views
AngularJS ng-click broken inside a popover
I'm trying to write a directive to load a partial html file, compile it against a scope & use it as the Bootstrap popover content.
However I'm stuck at a very basic step, write a hide() method on ...
7
votes
1answer
3k views
Bootstrap tooltip with angularjs using $http to load the content of the tooltip
I am running into small issue that I can't seem to figure out. The code below works, except for the first time you hover over the link. Any help is greatly appreciated.
http://jsfiddle.net/LpK6d/1/
...
6
votes
2answers
4k views
AngularJS bootstrap.ui modal not showing
I am trying to display a modal dialog using AngularJS bootstrap.ui. When I do a $modal.open(...) the screen grays out and the html from my templateUrl get called from the server, but no modal ...
6
votes
1answer
2k views
AngularJS: All buttons inside form triggers submit?
I apologize in advance if this is covered in the docs, but I can't seem to find it.
I have a pretty straightforward form which uses several buttons as I'm using twitter bootstrap. The problem is ...
6
votes
2answers
4k views
Does one need jQuery when using Twitter Bootstrap with Angular.js?
Is the jQLite (in built with AngularJS) sufficient to execute javascript functionality (like dropdowns) in Twitter Bootstrap?
docs.angularjs says:
DOM Manipulation from Stop trying to use jQuery ...
6
votes
1answer
6k views
How do I load AngularJS bootstrap module correctly?
In my Rails app, I have ui-bootstrap-0.2.0.js in the vendor/assets/javascripts directory. I have required the file in my application.js file.
I get an error when I specify the bootstrap as my ...
6
votes
2answers
2k views
TableSorter with Angularjs+bootstrap
Been trying to use the Jquery Table sorter along with Angular js+Boostrap framework. Now, on clicking any column for sorting, the entire width and structure of the table changes and a new row with the ...
5
votes
3answers
8k views
AngularJS and Bootstrap's split button dropdown
Do you know if someone ported Bootstrap's scripts to AngularJS?
I need Bootstrap's split button dropdown for my app and I'd really like to avoid pulling jQuery in. I seem to fail to google this out.
5
votes
3answers
11k views
How can I detect keydown or keypress event in angular.js?
I'm trying to get the value of a mobile number textbox to validate its input value using angular.js. I'm a newbie in using angular.js and not so sure how to implement those events and put some ...
5
votes
2answers
4k views
How to implement a scrollspy in angular.js the right way?
Does anyone have any thoughts on the best way to implement a scrollspy in an angular app? I started out with Twitter Bootstrap's implementation but I am struggling to find a good place to initialize ...
5
votes
2answers
7k views
How to get element in angularjs analog of get by id in javascript?
Lets say I have button:
<button type="submit"
value="Send"
id="btnStoreToDB"
class="btn btn-primary start"
ng-click="storeDB()"
...
5
votes
2answers
8k views
How can I use Bootstrap Multiselect Dropdown in AngularJS
I want to use Bootstrap Multiselect Dropdown http://davidstutz.github.io/bootstrap-multiselect/ in AngularJS. I hear that it's necessary to move it to Directive. But I think it's quite complicated ...
5
votes
1answer
4k views
Angular UI Bootstrap - I can open and close a modal just once
I have a weird problem with a modal. It should be a absolutely normal modal that I can open and close many times, but I can open just one and also just close one time! ...
5
votes
1answer
2k views
Dynamic links in Twitter Bootstrap navbar in angularjs
I've created an angular application that uses Twitter bootstrap.
I would like dynamic links in the navbar (like ng-href="#/{{course.id}}"
They never render - they end up like href="#/"
If I put the ...
5
votes
4answers
3k views
Refresh Bootstrap ScrollSpy after Angular model changes
I am attempting to use the bootstrap scollspy to highlight list items generated by an angular repeater.
The problem I'm running into is that I'm refreshing the scrollspy plugin from an angular ...
5
votes
1answer
2k views
dropdown in navigation bar does not expand (bootstrap, angular, directives, routes)
For some strange reason the bootstrap menu dropdown is not expanded on click when it is constructed through router template. Being used directly in the template it works fine.
Here is the plunker to ...
5
votes
2answers
9k views
angularjs bootstrap tabs using
I want to achieve bootstrap tabs like in this example,
using angularjs bootstrap - It contains directives tabbable and tabPane.
It doesn't work, i have no idea how to get the ball rolling.
...
1
vote
2answers
194 views
Angular js bootstrap button disable
I have the following angularjs app html file:
<!DOCTYPE html>
<html ng-app="StudentProgram">
<head>
<title>Student Program Management</title>
...
1
vote
1answer
38 views
angularjs bootstrap collapse horizontaly
How can I make angular bootstrap collapse, collapsing horizontally?
Something like here?
0
votes
1answer
22 views
What is the recommended date picker for Angular/Bootstrap?
There are several choices for adding a date picker control when using Angular/Bootstrap. Is there one that is "better"?
Here is what I have found:
HTML 5 input type of date: Inconsistent support in ...
0
votes
0answers
3 views
Pagination update after filter applied
I have a table which displays thousands of parsed JSON objects. I needed to implement a search filter, so I did so. However, when the objects are filtered, my pagination does not reflect the new array ...
0
votes
1answer
6 views
Angular-bootstrap trying to call collapse from the controller
I'm using Angular 1.2 and bootstrap 3.x and I'm trying to collapse DIV using angular-bootstrap plugin. I have form with search bar that retrieves specific data from a server in the controller using my ...
