-
-
Notifications
You must be signed in to change notification settings - Fork 321
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
modal() is undefined and modal template is appended to body #14
Comments
I'll take a look, my guess is that perhaps there's a problem with the template but it's possible it's an Angular 1.3 issue.. |
I'm having same problems when using AngularJS 1.2.20 even though showModal() promise seems to return correct object. |
I'm having the same problem with AngularJS 1.3.2. I tried using the template from the simple example and was able to show the modal through the console, but not through the code. Any ideas? |
If you are getting |
i Have same problem with Angular 1.3.0 My code controller: var app = angular.module('visorTecnico',['ui.bootstrap','acute.select','angular-loading-bar', "angucomplete-alt","angularModalService"]);
app.controller('TabController', ['$http', '$scope', '$window', function($http, $scope, $window){
$scope.articulos =[];
//AREA CARRITO COMPRA
$scope.mostrarCarrito=function(){
ModalService.showModal({
templateUrl: '../componentes/popCarritoCompra.html',
controller: "YesNoController"
}).then(function(modal) {
modal.element.modal();
modal.close.then(function(result) {
$scope.message = "You said " + result;
});
});
};
$scope.anadirCarrito=function(articulo){
$scope.carrito.push(articulo);
};
}]);
app.controller('YesNoController', ['$scope', 'close', function($scope, close) {
$scope.close = function(result) {
close(result, 500); // close, but give 500ms for bootstrap to animate
};
}]);
app.controller('GalleryController', function(){
this.current = 0;
this.setCurrent = function(newGallery){
this.current = newGallery || 0;
};
}); popCarritoCompra.html <div class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" ng-click="close(false)" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Yes or No?</h4>
</div>
<div class="modal-body">
<p>It's your call...</p>
</div>
<div class="modal-footer">
<button type="button" ng-click="close(false)" class="btn btn-default" data-dismiss="modal">No</button>
<button type="button" ng-click="close(true)" class="btn btn-primary" data-dismiss="modal">Yes</button>
</div>
</div>
</div>
</div> Call in index.html <li class="btn-navegacion col-md-2 col-xs-2">
<button type="button" class="btn btn-group-xm btn-navegacion" ng-click="mostrarCarrito()">
<span class="glyphicon glyphicon-shopping-cart" aria-hidden="true"></span> <span class="badge">{{carrito.length}}</span>
</button>
</li> When I debug it shows "undefined is not a function" . I tried to include " modal.js " boostrap but has not worked. Can anyone help me ? Thank you |
I'm having the same trouble. Angular 1.3. |
I had the same problem. Besides that you need to sure that bootstrap.js has been included into your page as pointed @dwmkerr, you also need to be sure that boostrap.js comes before angular.js. After I moved angular.js below bootstrap.js it starts working properly. |
I thought that bootstrap wasn't a dependency? |
@TheKnarf bootstrap isn't a dependency, unless you are using a bootstrap modal. There's examples in the sample app that show how to use custom modals. Bootstrap is just a very common framework that is used, but not strictly required |
Closing this issue as the solution is document in the FAQ. |
check the load order also. My bootstrap was being pulled in in the opposite order in zend using $views->headScript()->prependFile('/path/to/script.js') in the layout. (since it is pre-pending the values, the last one prepended ends up being listed first, the first one last) i.e.: $this->headScript()->prependFile($this->basePath() . 'jquery.js', 'text/javascript'); needed to be: $this->headScript()->prependFile($this->basePath() . 'angular-modal-service.js', 'text/javascript'); |
Code is entered exactly as the example and when the
showAModal()
function fires the modal template html is appended to the body while the console outputs this:TypeError: undefined is not a function
which points to this linemodal.element.modal();
Using Angular 1.3.0
Any insight is appreciated.
Code in the controller
The text was updated successfully, but these errors were encountered: