I have a very simply Modal Dialog that is displayed from the main header bar. When I close the modal dialog, it does not go back to the original page. The url displayed in the address bar is the modal that I closed. How do I go back to the original page that was displayed when I clicked the button. This is my code: This is in app.js
which is how the Modal, reportSettingModal is displayed.
.config(function ($stateProvider, $urlRouterProvider) {
$stateProvider
.state('login', {
url: '/login',
templateUrl: 'lib/views/login.html',
controller: 'LoginCtrl'
})
.state('home', {
url: '/home',
templateUrl: 'views/home.html',
controller: 'HomeCtrl'
})
.state('renderReport',{
url: '/renderReport/{guid}',
templateUrl: 'views/renderReport.html',
controller: 'RenderReportCtrl'
})
.state('vAnalyze',{
url: '/vAnalyze',
templateUrl: 'views/vAnalyze.html',
controller: 'VAnalyzeCtrl'
})
.state('reportSetting',{
url: '/reportSettingModal',
onEnter: function($modal){
$modal.open({
templateUrl: 'views/reportSettingModal.html',
controller: 'ReportSettingModalCtrl'
});
}
});
This is the HTML:
<div class="modal-header" id="reportSettingModal" style="background-color: #A33441; color: white;">
<h4 class="modal-title">{{title}}</h4>
</div>
<div class="modal-body">
<button type="button" class="btn btn-danger" style="margin-right: 5px; margin-left: 5px;" ng-click="updateWarehouse()">Update Warehouse</button>
</div>
<div class="modal-footer">
<button class="btn btn-sm btn-vow" id="closeButton" ng-click="close()">Close</button>
</div>
This is the controller:
angular.module('vAnalyzeApp.controllers')
.controller('ReportSettingModalCtrl', [
'$scope',
'$uibModal',
'Session',
'$uibModalInstance',
function($scope, $uibModal, session, $uibModalInstance){
$scope.username = session.user;
$scope.title = 'Report Settings';
$scope.close = function() {
$uibModalInstance.close();
};
} //end main function
]);
So, if I am on the VAnalyze page and I open the modal, when I close the modal, i want to be on teh VAnalyze page.
UPDATE
.run(['AuthService', 'configSettings', '$rootScope',
function (AuthService, configSettings, $rootScope) {
// Apply Product Code
configSettings.productCode = 'VANALYZE';
AuthService.configProduct(configSettings.productCode);
},
function ($rootScope) {
$rootScope.$on('$stateChangeSuccess', function(event, to, toParams, from, fromParams) {
$rootScope.$previousState = from;
});
}
]);
UPDATE I added the state.go
function to the modal close function but is still not returning the previous url when the modal was opened. This is my current close function:
$scope.close = function() {
$uibModalInstance.close();
$state.go($rootScope.$previousState.name, {
url: $rootScope.$previousState.url,
templateUrl: $rootScope.$previousState.templateUrl,
controller: $rootScope.$previousState.controller
});
};
Stepping thru the code the url, name templateUrl and controller are all properly set.
Option 1:
Inside your close function, you should specify to which state you want to go. Once the user close the modal.
$scope.close = function() {
$uibModalInstance.close();
$state.go('state-name');
};
Option 2:
If the URL is not relevant, you could call the Modal service from the VAnalyze state Controller, which is VAnalyzeCtrl:
$modal.open({
templateUrl: 'views/reportSettingModal.html',
controller: 'ReportSettingModalCtrl'
});
By doing this, you wont have to Redirect the user to the previous URL.