Topic: Error while hiding a modal which has been opened from a modal

Winter pro asked 5 years ago


ERROR TypeError: Cannot read property 'focus' of undefined
at ModalDirective.push../node_modules/ng-uikit-pro-standard/esm5/ng-uikit-pro-standard.es5.js.ModalDirective.focusOtherModal (ng-uikit-pro-standard.es5.js:15468)
at ng-uikit-pro-standard.es5.js:15406
at ModalDirective.push../node_modules/ng-uikit-pro-standard/esm5/ng-uikit-pro-standard.es5.js.ModalDirective.showBackdrop (ng-uikit-pro-standard.es5.js:15449)
at ModalDirective.push../node_modules/ng-uikit-pro-standard/esm5/ng-uikit-pro-standard.es5.js.ModalDirective.hideModal (ng-uikit-pro-standard.es5.js:15398)
at ng-uikit-pro-standard.es5.js:15338
at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
at Object.onInvokeTask (core.js:3645)
at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
at push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask (zone.js:496)
defaultErrorLogger @ core.js:1521
push../node_modules/@angular/core/fesm5/core.js.ErrorHandler.handleError @ core.js:1567
next @ core.js:4149
schedulerFn @ core.js:3385
push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub @ Subscriber.js:195
push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next @ Subscriber.js:133
push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._next @ Subscriber.js:77
push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next @ Subscriber.js:54
push../node_modules/rxjs/_esm5/internal/Subject.js.Subject.next @ Subject.js:47
push../node_modules/@angular/core/fesm5/core.js.EventEmitter.emit @ core.js:3377
(anonymous) @ core.js:3676
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
push../node_modules/@angular/core/fesm5/core.js.NgZone.runOutsideAngular @ core.js:3613
onHandleError @ core.js:3676
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.handleError @ zone.js:392
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:191
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:496
ZoneTask.invoke @ zone.js:485
timer @ zone.js:2054
setTimeout (async)
scheduleTask @ zone.js:2075
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:407
onScheduleTask @ zone.js:297
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:401
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask @ zone.js:255
scheduleMacroTaskWithCurrentZone @ zone.js:1114
(anonymous) @ zone.js:2090
proto.(anonymous function) @ zone.js:1394
push../node_modules/ng-uikit-pro-standard/esm5/ng-uikit-pro-standard.es5.js.ModalDirective.hide @ ng-uikit-pro-standard.es5.js:15338
(anonymous) @ KontaktFormModalComponent.html:63
handleEvent @ core.js:9947
callWithDebugContext @ core.js:11040
debugHandleEvent @ core.js:10743
dispatchEvent @ core.js:7406
(anonymous) @ core.js:7850
(anonymous) @ platform-browser.js:1140
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
onInvokeTask @ core.js:3645
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:420
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:496
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566

Damian Gemza staff commented 5 years ago

Dear Winter, I'm unable to reproduce that case. Could you please show me the code which you're using? Or provide me the reproduction steps. Best Regards, Damian

ewgiddings free commented 5 years ago

I am getting that same error. I use (click)="myFunction" and then when I click and call that function the function works and the modal closes but that error shows in the console.

ewgiddings free commented 5 years ago

The problem is most likely coming from you calling a function on (click) and the modal hiding without the modal.hide() being called? Or some manner of the modal hiding before MDB is notified of it hiding so it is trying to "focus" upon something that does not exist anymore. The documentation for how to call the hide function from a Typescript file is unclear here, I think there are some errors. If I can make a suggestion, it would help to have a working clear example of how to call the hide function from within a TypeScript function.

Damian Gemza staff commented 5 years ago

Guys, This problem should be fixed with the next release of MDB Angular. ewgiddings - I'm noticing your feature request, and we'll try to add it to our docs. Best Regards, Damian

ahmedmannai free commented 5 years ago

you can disable the focus fonctionnality on adding this ligne in the ngOnInit function YourModal['focusOtherModal'] = function() { };


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Resolved

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags