Dismiss Confirm firing through to form below

I have a modal set up like the docs recommend

 $scope.showConfirm = function() {
 var confirmPopup = $ionicPopup.confirm({
   title: 'Consume Ice Cream',
   template: 'Are you sure you want to eat this ice cream?'
 });
 confirmPopup.then(function(res) {
   if(res) {
     console.log('You are sure');
   } else {
     console.log('You are not sure');
   }
 });

};

When I dismiss the modal, the select box and or input field directly below the cancel button is getting focus as if the event is getting triggered ‘through’ the button. I tried using preventDefault(), stopPropogation and even disabling the fields while the popup is shown and nothing seems to work.

Any idea why this is happening?

Thanks,

Jay

I was able to get this working by disabling the fields below the popup while the popup is shown. For anyone who runs into this issue, you may have to use $timeout to enable the fields after the popup is closed.

This is a hack I know, but seems like it shouldn’t be happening in the first place?

If I have a minute after QA, I’ll post a codepen :smile: