2016-05-31 7 views
-1

Я разрабатываю модуль на веб-сайте для экспорта некоторых отчетов в формате pdf. После поиска в google, какая библиотека могла мне помочь, я нашел DOMPDF (php).DomPDF не работает с таблицами div?

Я создаю и показываю правильно pdf, но мне нужно создать html с таблицами, tr и td, потому что когда я пытаюсь отобразить то же самое, используя divs с опцией отображения, заданной на таблице, таблице-строке или таблице-ячейке, не работает и не отображает данные в правильном табличном формате.

Это проблема, потому что в представлениях я пытаюсь использовать divs и responsiv-дизайн, но когда я передаю в качестве параметра этот html, он не работает. По этому факту, пока я тестирую это, мне нужно было создать представление с обоими html-кодами. Первый для рендеринга представления с дизайном div, а другой - с тегами таблиц, который передается как параметр для рендеринга dompdf.

Может ли кто-нибудь, если это проблема программирования, проблема dompdf или что-то еще?

Любые предложения приветствуются.

Здесь код

   <link href="pdf.css" rel="stylesheet" type="text/css" media="screen" /> 
       <div class="tabledivinscripcion"> 
       <div class="titular-inscripcion"> 
         <img id="header" class="headers" src="ImagenesNoticias/'.$row_headers["timestamp"].'_'.$row_headers["header"].'"/> 
       </div> 

       <table> 
        <tr> 
         <td colspan="1"> <b>INFORME DE:</b>'.$row["nombreInforme"].'</td> 
         <td colspan="1" > <b>Categoría:</b>'.$row["categoria"].'</td> 
        </tr>     
        <tr> 
         <td colspan="1"> <b>Fecha:</b>'.$row["fecha"].'</td> 
         <td colspan="1"> <b>Hora:</b>'.$row["hora"].'</td> 
        </tr> 
        <tr> 
         <td colspan="1"> <b>Nombre:</b>'.$row["nombre"].'</td> 
         <td colspan="1"> <b>Licencia:</b>'.$row["licencia"].'</td> 
        </tr> 
        <tr> 
         <td colspan="1"> <b>Categoría:</b>'.$row["categoria2"].'</td> 
         <td colspan="1"> <b>Manga:</b>'.$row["manga"].'</td> 
        </tr> 
        <tr> 
         <td colspan="2"> <b>Hora del hecho::</b>'.$row["horaHecho"].'</td> 
        </tr> 
        <tr> 
         <td colspan="2"> <b>Descripción:</b> 
          <br> 
          <p class="justified">'.$row["descripcion"].'</p> 
          <br> 
         </td> 
        </tr> 
        <div class="titular-inscripcion foot"> 
          <img id="footer" class="headers" src="ImagenesNoticias/'.$row_headers["timestamp"].'_'.$row_headers["footer"].'"/> 
        </div> 

Здесь устанавливаемыми сотовыми

.headers{ 
    width:100%; 
    } 
    td{ 
    //border:1px solid black; 
    text-align:left; 
    height:25px; 
    } 
tr{ 
    //border:1px solid red; 
} 
table{ 
    // border:1px solid green; 
    height:75%; 
    width:85%; 
    margin-left:auto; 
    margin-right:auto 
} 
.justified{ 
    text-align:justify; 
} 
.tabledivinscripcion{ 
    background:#FFF; 
    margin-bottom:20px; 
    padding:0px; 
    position:relative; 
    width:100%; 
    min-height:100%; 
    margin-left:auto; 
    margin-right:auto; 
} 
.foot{ 
    position: absolute; 
bottom: 0; 
} 
.pdescripcion{ 
    text-align: justify; 
    display:inline-block; 
    padding-left:10px; 
    padding-right:10px; 
} 
.titular-inscripcion{ 
    margin-left:auto; 
    margin-right:auto; 
    text-align:center; 
    display:table; 
    width: 100%; /*Optional*/ 
    table-layout: fixed; /*Optional*/ 
} 

Этот код прилагается окончательный вариант PDF. Чтобы сделать то же самое с div, я попытался поместить div с display: table в качестве тега таблицы и div с отображением: table-row в качестве тр-тега и, наконец, div с отображением: table-cell в качестве тега td.

спасибо.

+0

Просьба поделиться образцом используемого HTML/CSS. – BrianS

ответ

0

Dompdf работает со столами, созданными с использованием типов отображения таблиц CSS. Например, следующее должно отображать таблицу со 100% шириной с двумя столбцами. Вы заметите, что атрибуты таблицы будут применяться в зависимости от ситуации. В первой строке и одном столбце spanning во второй строке.

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
 
    <style> 
 
    .table { display: table; width: 100%; border-collapse: collapse; } 
 
    .table-row { display: table-row; } 
 
    .table-cell { display: table-cell; border: 1px solid black; padding: 1em; } 
 
    </style> 
 
</head> 
 
<body> 
 
    <div class="table"> 
 
    <div class="table-row"> 
 
     <div class="table-cell"><b>INFORME DE:</b>dompdf</div> 
 
     <div class="table-cell"><b>Categoría:</b>tables</div> 
 
    </div> 
 
    <div class="table-row"> 
 
     <div class="table-cell" colspan="2"> <b>Hora del hecho:</b>9:00</div> 
 
    </div> 
 
    </div> 
 
</body> 
 
</html>

Что он не поддерживает, как в текущей версии (0.7.0, как этот пост) является декларации CSS, которые связаны с адаптивным дизайном, такие как запросы средств массовой информации (помимо тех, которые нацелены на конкретную тип дисплея, например @media print).

Вместо создания страницы с несколькими структурными элементами (таблицы и таблицы div) вам следует рассмотреть возможность создания нескольких таблиц стилей для различных сред отображения. Вы всегда можете ориентировать dompdf в своей таблице стилей, окружая соответствующий CSS с помощью @media dompdf { ... }.

Смежные вопросы