Tarun:
I have a mean stack application where there is a Left Panel for navigation. One of the tabs have a form, and after I submit the form, I call a function, which after successful completion has a $state.go('secured.dashboard');
which redirects it to another tab(dashboard)
. This works fine, but on the left panel the previous tab(application form tab)
is still highlighted as active. Although, On clicking the tab, the active menu is highlighted correctly.
So, the problem is when I click submit, it redirects to a different tab(dashboard)
but on the left-navigation panel, some other tab(application Form)
is highlightened, although I change the variable $scope.selectedMenu = "dashboard";
. I have added the relevant code snippets from files:
header-template.html
dashboard.js
(function() {
var app = angular.module('dashboard', []);
app.config(['$stateProvider', function($stateProvider) {
$stateProvider.state('secured.dashboard', {
url: '/dashboard',
controller: 'DashboardController',
templateUrl: '/views/dashboard.html'
});
}]);
app.controller('DashboardController', ['$scope', 'AuthService', 'user', '$state', '$http', function($scope, AuthService, user, $state, $http) {
console.log("yes, the controller is here");
$scope.user = user;
AuthService.setUser(user);
$scope.applicationShow = {};
$scope.logout = function() {
AuthService.logout().then(function() {
$scope.user = null;
$state.go('unsecured');
})
}
applicationForm.js
(function() {
var app = angular.module('applicationForm', []);
app.config(['$stateProvider', function($stateProvider) {
$stateProvider.state('secured.applicationForm', {
url: '/applicationForm',
controller: 'applicationFormController',
templateUrl: '/views/applicationForm.html',
params: {
obj: null
}
});
}]);
app.controller('applicationFormController', ['$http', '$scope', '$state', '$uibModal', function($http, $scope, $state, $uibModal) {
console.log($state.params.obj);
if ($state.params.obj == null) {
$scope.application = {
technical: false,
business: false
};
} else {
$scope.application = $state.params.obj;
}
console.log("I am finally the application");
console.log($scope.application);
$scope.submitApplication = function() {
$scope.submitted = true;
console.log("Submit called");
console.log($scope.application.title);
console.log($scope.user.email);
console.log("Yes, i am here!");
console.log($scope.application.userEmail);
$scope.application.state = "SUBMITTED";
$scope.application.heirarchy = $scope.managerjson[$scope.application.managerName].senior;
console.log($scope.application.heirarchy);
var check = 0;
$http.get('/application/applicationlistNum/').then(function(response) {
$scope.application.number = response.data.value.sequence_value;
console.log($scope.application.number);
for (var i = 0, len = $scope.applicationList.length; i if ($scope.applicationList[i]._id == $scope.application._id) {
check = 1;
console.log("matched");
break;
}
}
if (check == 1) {
$http.put('/application/applicationlist/' + $scope.application._id, $scope.application).then(function(response) {
refresh();
});
} else {
$http.post('/application/applicationList', $scope.application).then(function(response) {
console.log("Successfully submitted");
refresh();
});
}
swal({
title: "Great!",
text: "We have received your request",
type: "success",
timer: 3000,
confirmButtonText: "Wohoo!"
});
var contactInfo = {
managerEmail: $scope.application.managerName,
selfEmail: $scope.application.userEmail,
name: $scope.managerjson[$scope.application.managerName].name
};
clear();
sendMail(contactInfo);
console.log("changing states");
$scope.selectedMenu = "dashboard";
$state.go('secured.dashboard');
});
};
applicationForm.html
Posted in S.E.F
via StackOverflow & StackExchange Atomic Web Robots
This Question have been answered
HERE