Topic: Add action button to columns header of Vue Datatable

Riva priority asked 10 months ago


Does Vue Datatable support add an icon as an action button(going to have a hover message) to the column's header element? If we can, can I have an example of how to implement it? Thanks


Bartosz Cylwik staff answered 10 months ago


Hi, headers don't inject html content like normal rows does (example with action button https://mdbootstrap.com/docs/vue/data/datatables/#section-action-buttons).

You can try however looking for your header after the component mounts (onMounted + nextTick) and then adding some html to the th element. For example:

https://mdbootstrap.com/snippets/vue/b-cylwik/5559976#js-tab-view

Hope that helps. Best Regards!



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

  • ForumUser: Priority
  • Premium support: Yes
  • Technology: MDB Vue
  • MDB Version: MDB5 4.0.0
  • Device: thinkpad
  • Browser: chrome
  • OS: windows
  • Provided sample code: No
  • Provided link: No