Topic: Popovers Fail After Table Column Sorting

scottwilliams priority asked 8 months ago


Expected behavior When a popover trigger item is clicked in a table row/column, the popover appears.

Actual behavior Popover appears on initial table render. After a column sort the popovers in the table stop working.

Resources (screenshots, code snippets etc.) Script to initialize the popovers after the table renders:

const popoversEl = document.querySelectorAll('[data-mdb-toggle="popover"]');
    popoversEl.forEach((popoverEl) => {
      const popover = new mdb.Popover(popoverEl)
    });

However, after you sort the table by a column header the popovers stop working.


konstantin@lasertag-center.de priority commented 8 months ago

There you go, I think this might help you. I wrote you a snippet as a description

https://mdbootstrap.com/snippets/standard/konstantinlasertag-center-de/5803266


Kamila Pieńkowska staff commented 8 months ago

This is a good solution. Does it resolve your issue?


scottwilliams priority commented 8 months ago

Yes it does! Works like a charm! Thanks konstantin@lasertag-center.de!



Please insert min. 20 characters.

FREE CONSULTATION

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

Status

Opened

Specification of the issue

  • ForumUser: Priority
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: MDB5 6.4.1
  • Device: Macbook Pro
  • Browser: Chrome
  • OS: MacOS Sonoma 14.1
  • Provided sample code: No
  • Provided link: No