Currently, I m trying to fire an event when I close my modal. I found this plunker with the functionality what I want to create. When I try to recreate this plunker in my own js file, it doesn't seem to work. The code below is a part of my main js file. If a button is pressed this piece of code is fired.
function editActivity(activityId) {
var editModal = $modal({
templateUrl: '/DesktopModules/Name/Angular/ViewModels/main/edit.html',
locals: {
activityId: activityId
},
controller: 'editCtrl',
controllerAs: 'vm',
show: true,
keyboard: false,
backdrop: 'static'
});
editModal.result.then('modal.hide', function (result) {
alert("finally")
if (result === true) {
// Reload the list if the selected was updated.
searchActivities();
}
});
return null;
}
This code creates a modal but I get the following error:
Cannot read property 'then' of undefined
at mainController.editActivity
When I try to close the modal a new error message is given. The code for the closing the modal is:
function saveActivity() {
var updateData = {
Id: vm.EditActivity.Id,
Zipcode: vm.EditActivity.Zipcode,
AreaType: vm.EditActivity.AreaType,
Activities: vm.EditActivity.Activities
}
apiService.updateActivity(updateData);
$modal.close(true);
}
}
The error message is:
$modal.close is not a function
at editController.saveActivity
I found several quetion related to this subject like this one and this one but none of those solutions seems to work for me. Keep in mind that i m working with angular-strap.
I found a solution after looking of the possible options of modal(site).
One of the options of modal is: Onhide. When the modal is hidden, it will fire a function. My new main js file looks the following:
function editActivity(activityId) {
var editModal = $modal({
templateUrl: '/DesktopModules/name/Cogas/Angular/ViewModels/main/edit.html',
locals: {
activityId: activityId
},
controller: 'editCtrl',
controllerAs: 'vm',
show: true,
keyboard: false,
backdrop: 'static',
onHide: function () {
searchActivities();
}
});
}
I removed the $modal.close() from the modal js and added hide(). This is probaly not the best way to do this, but it is sufficient for me.