Topic: Adding btn-floating to open a modal generates an Uncaught TypeError
Expected behavior
I need to open a modal using a floating button, so i add the class btn-floating to a button and i expect it to work
Actual behavior
If i click on the button with class 'btn-floating' an error occurs in console
Uncaught TypeError: this._element is undefined value modal.js:340 value modal.js:211 r modal.js:88
Resources (screenshots, code snippets etc.)
Hi,
@giorgio.ponza I can't see your error in this snippet. I can only see errors pointed out by @UNNdev and they are related to FA icons. To get rid of them add pe-none class to FA icons in buttons. Here is the snippet https://mdbootstrap.com/snippets/standard/d-wajszczuk/3216319#html-tab-view .
Keep coding,
Dawid
giorgio.ponza pro premium priority commented 3 years ago
If you click on the rightmost button (the float one), the error suddenly occurs. To generate an error with the 'rounded' button, you have to click some times. Adding the 'pe-none' to the icon solves the problem, but the button stays in the 'clicked' status, with a darker blue. I will accept your answer, but to me it seems still a bug.
Dawid Wajszczuk staff commented 3 years ago
Hi. Bootstrap does the same thing with buttons stayed as 'clicked' while the modal is closed https://mdbootstrap.com/support/standard/adding-btn-floating-to-open-a-modal-generates-an-uncaught-typeerror/ . So I wouldn't consider this as a bug.
Actually, I get an error almost every time I click on any button in your example.
mdb.min.js:316 Uncaught TypeError: Cannot read property 'classList' of undefined
at r.value (mdb.min.js:316)
at r.value (mdb.min.js:316)
at new r (mdb.min.js:316)
at r.<anonymous> (mdb.min.js:316)
at new r (mdb.min.js:316)
at HTMLAnchorElement.<anonymous> (mdb.min.js:316)
at HTMLDocument.e (mdb.min.js:310)
The funny (it really isn't) thing is that I am also getting such errors in my project and have no clue why. Using Chrome / Chromium based Edge on Windows 10.
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 Standard
- MDB Version: MDB5 3.9.0
- Device: Desktop
- Browser: Firefox 89.0.2
- OS: Linux
- Provided sample code: No
- Provided link: Yes