1. MDB Home Page
  2. Support Main Page
  3. MDB Standard
Topic: Werid Modal Error

stefangregg priority asked 11 months ago

Hia,

I have been randomly getting this error when I click to open a modal, however it doesn't stop the modal from opening. I have been unable to replicate in a snippet.

Any help would be greatly appreciated!

Please see the code below:

<a data-mdb-toggle="modal" data-mdb-target="#mymodal_modal" class="btn btn-sm btn-outline-primary ripple buttonhover"><i class="fa-solid fa-plus"></i></a>

<div class="modal fade" id="mymodal_modal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable modal-lg">
      <div class="modal-content">
        <div class="modal-body">
            <!-- Content here -->
        </div>
    </div>
</div>

Error:enter image description here

Mikołaj Smoleński staff commented 11 months ago

Can you share also modal toggler code or method that opens the modal?

Keep coding,  Mikołaj from MDB

stefangregg priority commented 11 months ago

Sure thing! I have appended it to my question.

Mikołaj Smoleński staff commented 11 months ago

Something is wrong:

The toggler has data-mdb-target="#addbankaccount_modal" attribute, but the modal's id is mymodal_modal. It should be the same.

Keep coding,  Mikołaj from MDB

stefangregg priority commented 11 months ago

Sorry yes the ID's are the same. That was a typo from when I was copying over an example.

Mikołaj Smoleński staff commented 11 months ago

The code is correct, but it looks like it's the code from the MDB5 version. You picked MDB4 4.20.0 in this ticket, so I am not sure now which version of MDB are you using. Can you specify it?

Keep coding,  Mikołaj from MDB

stefangregg priority commented 10 months ago

MDB5, the lastest version.

stefangregg priority commented 10 months ago

Any update on this?

Grzegorz Bujański staff answered 10 months ago

This error appears when you click on the icon. Just add pointer-events=none to fix this:

<i style="pointer-events: none" class="fa-solid fa-plus"></i>
Write
Create snippet
Please insert min. 20 characters.

FREE CONSULTATION

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

Answered

Specification of the issue
  • User: Priority
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: MDB5 4.0.0
  • Device: All
  • Browser: All
  • OS: All
  • Provided sample code: No
  • Provided link: No
Tags
modals
About author
stefangregg
47Support score
15Questions 0Answers 4Snippets