Topic: Modal won't open from button on component added to the page through appendChild
ikan_nak priority asked 3 days ago
*Expected behavior*I have a regular HTML table loaded asynchronously and added to the page using appendChild with a number of links on them, all of this format:
<a href="retrieveMachineParameterBootstrap.action?actionType=0" class="c-table-display__action-icon"
onclick="return false;" data-mdb-toggle="modal" data-mdb-modal-init=""
data-kobee-url="retrieveMachineParameterBootstrap.action?actionType=0"
data-mdb-target="#machineParameterDialog" data-kobee-title="Create Machine Parameter">
<img src="/images/create.png" title="Create Parameter">
</a>
This is one link anchor, but there are dozens more that all need to use the #machineParameterDialog modal:
<div id="machineParameterDialog" class="modal">
<div class="modal-dialog">
<div class="modal-content" id="machineParameterDialogContents"></div>
</div>
</div>
The intent is that when a link is clicked, it should open the modal and asynchronously load the contents of that modal using the data-kobee-url dataset attribute, including the header, the footer and the body. I had something like this working in Dojo 1.16, and I had a similar code without the asynchronous table part working in a Bootstrap 5.2 project.
Actual behavior
When I put a breakpoint inside my loadModal code (see the snippet below), the breakpoint never gets reached. I think what's happening is that the HTML table, which gets loaded asynchronously and added to the page using appendChild, does not get parsed by MDB, and hence the mdb-modal-init attributes don't get detected and the modal doesn't get inited. If this is the case, how would I go about getting MDB to parse content added using appendChild?
Resources (screenshots, code snippets etc.)https://mdbootstrap.com/snippets/standard/ikan_nak/6277425#js-tab-view summarized Modal.js code
Kamila Pieńkowska staff answered 21 hours ago
Please publish your snippet or I won't be able to see it.
ikan_nak priority commented 21 hours ago
Sorry, I thought I had published it. it should be published now.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Priority
- Premium support: Yes
- Technology: MDB Standard
- MDB Version: MDB5 7.3.0
- Device: Desktop computer
- Browser: Edge
- OS: Windows 11
- Provided sample code: No
- Provided link: Yes