Topic: [mdbPopover] Popover will not dismiss after click on page (only iPad und Safari)
Expected behavior In Safari on iPad Popup will dismiss after click on page Actual behavior Unfortunately no. Resources (screenshots, code snippets etc.)
<button type="button" mdbBtn color="danger" class="waves-light"
mdbPopover="And here some amazing content. It's very engaging. Right?"
placement="right"
mdbPopoverHeader="Dismissible popover"
[outsideClick]="true"
triggers="click" mdbWavesEffect>
I will dismiss after click on page
hmm that's funny that the following code is working fine in the ng-uikit-pro empty project, but the same code is not working with our application.
`<mdb-icon fas icon="info-circle" class="info-circle"
mdbPopover="Dismissible popover" placement="bottom"
[outsideClick]="true" triggers="click"></mdb-icon>`
iPad Air A1474 ios 12.2
Damian Gemza staff commented 5 years ago
Is there a possibility to send me the whole project where your problem is reproducible? You can find me here: d.gemza@mdbootstrap.com
Thank for your support. Ich have successfully reproduced the problem with the following code on iPad pro 12.9 2018 Safari 12 emulators on Browserstack.
app.component.html:
<div class="background-view view"><div class="mask gradient d-flex justify-content-center align-items-center flex-column">
<div class="container">
<div class="row">
<div class="col-lg-6 white-text text-center text-md-left mt-xl-5 wow fadeInLeft"
data-wow-delay="0.3s">
<h1 class="h1-responsive mt-sm-5">Title</h1>
<hr class="hr-light">
<p class="mb-sm-4 mb-2">headline</p>
<mdb-icon fas icon="info-circle" class="info-circle"
mdbPopover="Dismissible popover" placement="bottom"
[outsideClick]="true" triggers="click"></mdb-icon>
</div>
<div class="col-lg-6 col-xl-5 mt-xl-5 wow fadeInRight">
</div></div></div></div></div>
app.component-scss:
html, body, header, .view { min-height: 500px; }
Arkadiusz Idzikowski staff commented 5 years ago
Thank you for the code. We managed to reproduce the problem on this example and we will take a closer look at it.
Any news about the problem?
Damian Gemza staff commented 5 years ago
Dear @jespenhain
We have debugged this problem, and we have to resolve it on our side.
Please be patient, we'll let you know, when this problem will be resolved.
Best Regards,
Damian
Dear @jespenhain
This problem will be resolved with the next version of MDB Angular.
Best Regards,
Damian
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: Yes
- Technology: MDB Angular
- MDB Version: 7.5.4
- Device: iPad
- Browser: Safari
- OS: IOS
- Provided sample code: No
- Provided link: No
Damian Gemza staff commented 5 years ago
Dear @jespenhain
I have tried to reproduce your problem with the code which you have provided but without success. For me, everything is working fine. I have launched two iPad 2018 Safari emulators on Browserstack, and every time popover is closing after clicking on the page.
Are you sure, that you're using 7.5.4 version? Could you please specify exact version of your iPad and Safari browser? Does this problem exist on another Apple device such as MacBook / iPhone?
Best Regards,
Damian