Как распечатать или преобразовать в PDF из изображений столбцов таблицы данных

Question

Я хочу экспортировать таблицы данных в формате, подобном

------------------------------------
sr | id  | name |  phone     |  photo
------------------------------------
1  | s12 | John | 9874563210 | Image 
-------------------------------------

Примерно так:

HTML код:

">

Если фотография недоступна, тогда onError="this.onerror=null; отобразит заполнитель.

Мой JavaScript код:

    <script>
        $('#example23').DataTable({
            dom: 'Bfrtip',
            buttons: [
                {
                  extend: 'copy',
                  title: 'Result for <?php echo $_SESSION["pd_name"]?>'
                },  
                {
                  extend: 'excel',
                  title: 'Result for <?php echo $_SESSION["pd_name"]?>'
                }, 
                {
                  extend: 'pdf',
                  title: 'Result for <?php echo $_SESSION["pd_name"]?>'
                }, 
                {
                  extend: 'print',
                  title: 'Result for <?php echo $_SESSION["pd_name"]?>'
                }
            ],
            "pageLength": 50,
            "oLanguage": {
              "sSearch": "Quick Search / Sorting: "
            }
        });

        </script>

Когда я экспортирую свою таблицу, столбец фотографий остается пустым. Но изображения отображаются в таблицах данных. Я хочу отобразить все изображения в моем экспортированном файле (PDF). Я использую datatables. net библиотеки.

Вот моя скрипка https://jsfiddle.net/pratapamit/hztfdrs1/14/

Answer 1

Теперь я могу решить эту печать изображения, используя библиотеку https://printjs.crabbly.com/. Это очень легко реализовать.

Сначала нам нужно включить библиотеку Print. js на странице.

 <script src="print.js"></script>

Если вы будете использовать модальную функцию, также включите Print. css на странице.

<link rel="stylesheet" type="text/css" href="print.css"> 

Вот и все. Теперь вы можете использовать Print. js на ваших страницах.

Используйте кнопку на странице, например

<button type="button" class="dt-button buttons-print" onclick="printJS({ printable: 'table_print', type: 'html', header: 'Title' })">Print</button>
<div class="table-responsive" id="table_print">
<!-- Your Table here -->
</div>

Надеюсь, это поможет и другим.