wenzhixin
Print extension does not handle icons (neither in headers, nor in rows)
Bootstraptable version(s) affected
1.19.1
Description
The Table Print extension of BootstrapTable does not show icons when printing (neither in headers, nor in rows) with Bootstrap 5 or earlier versions.
Example(s)
https://live.bootstrap-table.com/code/realraec/10404
If you click on the print button in the buttonbar, the second column (named <i class="fa fa-print"></i>) shows an empty header in the rendering of the table. The same happens (the icon disappears) if the icon is to be found in a row and not just in a header.
Further examples:
-
In my project I have a "Warnings" column that usually show just a number between 0 and 9, and having the column named "Warnings" makes it too wide for what it contains. I use a warning icon (e.g.
<i class="bi bi-exclamation-triangle-fill"></i>) instead that disappears when I use the extension, and makes the column too narrow. -
In my project I have a "Gender" column whose cells are set to be formatted to show nothing but a gender icon (e.g.
<i class="bi bi-gender-female"></i>), and the column shows up empty except for the header when I use the extension.
Possible Solutions
Is this intended? I understand that the plugin gets rid of all the HTML, but shouldn't icons be displayed? At the very least, is there a workaround?
Additional Context
In the next version we have a method called printPageBuilder, which can be overwritten.
In that function you could add the style tag for font-awesome.
Example: https://live.bootstrap-table.com/code/UtechtDustin/12299
The problem is that the css is loaded after we opened the print dialog, which means on the first print call the icon is still missing.
I tried to figure out if there is an option to add the DOMContentLoaded event for the print window, but i don't found any..
@wenzhixin @djhvscf any ideas ?
