CODEWITHSUNDEEP
htmlcssangularjsdjangotwitter-bootstrap
blackwindow
blackwindow

Reputation: 437

AngularJS Modal (ui.bootstrap.modal) is not working

I just wanna implement a AngularJS Modal (ui.bootstrap.modal)inside my project. Whenever I click a button in my page, a new pop-up (Large modal) need to be come out. I have used the bootstrap codes. But dont its not seems to be working. Please help me on it. Thanks in advance my JS:

$scope.checkBinning = function(){
            selected_checks = $scope.checkGridOptions['selectedItems'];
                $scope.no_show = false;
                $scope.final_select=false;
                $("#checkRecommendTarget").modal('show');
                $scope.route = 'for_escalate';
                $scope.select_title = 'GROUPS';
                $scope.heading = 'Check Binning';

        };

and my html portion:

<button type="button" class="btn btn-danger" ng-click="checkBinning()"> Check Binning </button>

Upvotes: 0

Views: 193

Answers (1)

user1608841
user1608841

Reputation: 2475

You are using jquery bootstrap js functionality in your code Try following : 

<button class="btn btn-primary" type="button" ng-click="checkBinning()">Check Binning</button>

and 

    $scope.checkBinning = function () {
    selected_checks = $scope.checkGridOptions['selectedItems'];
    $scope.no_show = false;
    $scope.final_select = false;
    var modalInstance = $modal.open({
        animation: $scope.animationsEnabled,
        templateUrl: 'checkRecommendTarget.html',

        }
    });
    $scope.route = 'for_escalate';
    $scope.select_title = 'GROUPS';
    $scope.heading = 'Check Binning';

};

and add your modal template like in script 

<script type="text/ng-template" id="checkRecommendTarget.html">

    </script>

and dont forget to add $modal dependency in your controller

Upvotes: 1

Related Questions