Trying to create proper PDF document, using PHP and TCPDF.
Can you help me, how can I use writeHTML function to create and center table, in TCPDF?
Tryed with:
$html = '
<div style="margin-left: auto; margin-right: auto; width: 50%">
<table border="1" width="200" align="center"><tr><td><b>Invoice number: '.$this->xInvoiceNumber.'</b></td></tr></table>
<br />
<table border="1" width="200" align="center"><tr><td>'.$this->xClient.'</td></tr></table>
<br />
</div>
... but no luck.
You have to make a table with 3 columns, set the width for every one of them and in the middle one you have to create your table.
<table>
<tr>
<td style="width:25%"></td>
<td style="width:50%"><table><tr><td>Your content</td></tr></table></td>
<td style="width:25%"></td>
</tr>
</table>
I'm not proud of this method but it's working :)
Ok, so I don't know if there is solution for my problem...
However, I did manage to solve it by using writeHTMLCell funcion, ie.
$this->writeHTMLCell(50, 0, 50, 50, 'cellcontent', 'LRTB', 1, 0, true, 'L');
If somebody can find better solution, please reply.
Tnx!
Try this code; it worked for me:
<table style="width:100%">
<tr>
<td style="width:30%">left margin</td>
<td style="width:40%">
<table border="1" style="width:100%">
<thead>
<tr>
<td style="width:100%" colspan="2"></td>
</tr>
<tr>
<td style="width:40%"><b></b></td>
<td style="width:60%"><b></b></td>
</tr>
</thead>
</table>
</td>
<td style="width:30%">rigth margin</td>
</tr>
</table>
Try replacing your opening div tag with this...
<div style="margin:5px auto; width:50%">
Never done anything like this however, this is the code you would need to center a table that is the cross browser compatible
<div style="text:align:center;">
<table style="margin:0px auto" border="1" width="200" align="center">
<tr>
<td><b>Invoice number: </b></td>
</tr>
</table>
<br />
<table style="margin:0px auto"border="1" width="200" align="center">
<tr>
<td>Client</td>
</tr>
</table>
<br />
</div>
If pdfs support css i would advise styling the html elements using css
table{
border:1px solid black;
margin:0px auto;
text-align:center;
width:200px;
}
Hope this helps!
Related
In our system, users often copy/paste tables from other sources, such as Excel/Word, which results in tables that have height tags or attributes in a number of places. I was thinking I could use pattern matching (preg_replace) to find and remove those instances as the inclusion of height specifications is causing issues in our system when this HTML is used by our PHP API to output formatted reports, but I've been trying to do so for the last 3 days without much success as I'm not adept at using regular expressions in this way.
I've read the documentation and examples on php.net and reviewed quite a few of the posts here on this topic, but I still don't know how to only apply the pattern matching to only instances within a tag, etc.
Also, how would I remove the entire tag if it only includes a height attribute, and then only the height attribute if other attributes are included?
Here is an example of the code I need to clean. This is just a small portion, as it typically will include multiple table elements similar to what's I've included below, along with images, text, etc.:
<table style="height:126px;" width="243">
<tbody>
<tr style="height: 18px;">
<td style="width: 38.5px; height: 18px;">ABC</td>
<td style="width: 41.5469px; height: 18px;">123</td>
<td style="width: 50.6562px; height: 18px;">DEF;</td>
<td style="width: 99.2969px; height: 18px;">456</td>
</tr>
<tr style="height:18px;">
<td style="width: 38.5px; height: 18px;">GHI</td>
<td style="width: 41.5469px; height: 18px;">789</td>
<td style="width: 50.6562px; height: 18px;">JKL</td>
<td style="width: 99.2969px; height: 18px;">012</td>
</tr>
<tr style="height:18px;">
<td style="width: 38.5px; height: 18px;">MNO</td>
<td style="width: 41.5469px; height: 18px;">345</td>
<td style="width: 50.6562px; height: 18px;">PQR</td>
<td style="width: 99.2969px; height: 18px;">678</td>
</tr>
</tbody>
</table>
Can this be done using preg_replace, or do I need to use a different technique? Any guidance or assistance would be greatly appreciated. A "cleaned" version of the above would look like this:
Cleaned
<table width="243">
<tbody>
<tr>
<td style="width: 38.5px;">ABC</td>
<td style="width: 41.5469px;">123</td>
<td style="width: 50.6562px;">DEF;</td>
<td style="width: 99.2969px;">456</td>
</tr>
<tr>
<td style="width: 38.5px;">GHI</td>
<td style="width: 41.5469px;">789</td>
<td style="width: 50.6562px;">JKL</td>
<td style="width: 99.2969px;">012</td>
</tr>
<tr>
<td style="width: 38.5px;">MNO</td>
<td style="width: 41.5469px;">345</td>
<td style="width: 50.6562px;">PQR</td>
<td style="width: 99.2969px;">678</td>
</tr>
</tbody>
</table>
Have you considered simply swapping the 'height:' style attribute with a non-existent one (ie: the DOM will ignore unknown tags); for example:
$str = '<table style="height:126px;" width="243">
<tbody>
<tr style="height: 18px;">
<td style="width: 38.5px; height: 18px;">ABC</td>
<td style="width: 41.5469px; height: 18px;">123</td>
<td style="width: 50.6562px; height: 18px;">DEF;</td>
<td style="width: 99.2969px; height: 18px;">456</td>
</tr>
<tr style="height:18px;">
<td style="width: 38.5px; height: 18px;">GHI</td>
<td style="width: 41.5469px; height: 18px;">789</td>
<td style="width: 50.6562px; height: 18px;">JKL</td>
<td style="width: 99.2969px; height: 18px;">012</td>
</tr>
<tr style="height:18px;">
<td style="width: 38.5px; height: 18px;">MNO</td>
<td style="width: 41.5469px; height: 18px;">345</td>
<td style="width: 50.6562px; height: 18px;">PQR</td>
<td style="width: 99.2969px; height: 18px;">678</td>
</tr>
</tbody>
</table>';
$str = str_replace("height:","nulled:",$str);
echo $str;
I took your table HTML, put it into a string variable and did a simple str_replace to swap all references to height: to nulled: which strips the height attribute out the string and when I echo the string back I get the cleaned table you put in your example.
There may be an even prettier approach, but this worked for me. :)
this code not work in table with mPDF php class
<table>
<tr>
<td class="contentDetails">
<td class="contentDetails">
<h3 style="text-align: right;"><strong>text align right</strong></h3>
<h3 style="text-align: center;"><strong>text align center</strong></h3>
<h3 style="text-align: left;"><strong>text align left</strong></h3>
</td>
</tr>
</table>
i triad use
.contentDetails > h3 {display: block;}
but not work and between td it's html from Editor tinymce
this full code from script
and when do output found content the td text align left not right or center
<?php
$html = '
<h1>mPDF</h1>
<table style="border-collapse: collapse;
font-size: 12px;
font-weight: 700;
margin-top: 5px;
border-top: 1px solid #777;
width: 100%;">
<tbody>
<tr>
<td class="contentDetails">
<h3 style="text-align: right;"><strong>text align right</strong></h3>
<h3 style="text-align: center;"><strong>text align center</strong></h3>
<h3 style="text-align: left;"><strong>text align left</strong></h3>
</td>
</tr>
</tbody>
</table>';
include("mpdf.php");
$mpdf=new mPDF('c');
$mpdf->WriteHTML($html);
$mpdf->Output();
exit;
?>
Try the below code. I think it will help you.
<table width="100%">
<tr>
<td class="contentDetails">
<th align="left"> <h3><strong>text align right</strong></h3></th>
<th align="center"> <h3><strong>text align center</strong></h3></th>
<th align="right"> <h3><strong>text align left</strong></h3></th>
</td>
</tr>
</table>
using extra tags in this.
I have prepared a lot of hours a content to print (mPdf v.6). Now i can give an advice to all. Don't use tables to align content or simply hold the content. Almost all css properties of elements work fine. But - but must not be nested in table.
The problem is the width of the container which is fitting with the content. Set table width to 100%
table {
width: 100%;
}
<table>
<tr>
<td class="contentDetails">
<h3 style="text-align: right;"><strong>text align right</strong></h3>
<h3 style="text-align: center;"><strong>text align center</strong></h3>
<h3 style="text-align: left;"><strong>text align left</strong></h3>
</td>
</tr>
</table>
okay, so my head is going to explode right now, i'm searching 5 hours non stop for my problem..
i want the menu2.html which is inside a table, to appear on the end of the page, After the end of the Content!
i tried a lot, like:
1-position: absolute; bottom: 0;
2-position: absolute; left: 100px; top: 150px; etc etc...
But this is not what im looking for!
I could put the menu2 after the content only by editing the top:150 But there are a lot of pages with different contents, so the menu2 doesn't suit in the other pages!
I hope you can help me.
This Is My PHP file:
<style type="text/css">
.menu2 {
background-image: url('<?=$profpic;?>');
background-attachment:fixed;
background: yellow;
}
</style>
<title>Hello</title>
</head>
<body>
<table width="100%" height="58%" border="0" cellspacing="0" cellpadding="2" class="heading">
<tr>
<td>
<?php include('menu.html');?>
</td>
</tr>
<tr>
<td><img src="pictures/logo.png" width="1335" height="300"></td>
</tr>
</table>
<table width="85%" height="1%" border="1" cellspacing="0" cellpadding="2">
<tr>
<td>
<?php include('menu2.php');?>
</td>
</tr>
</table>
<?php
$profpic = "pictures/bg.jpg";
?>
</body>
</html>
It's not clear to me what you are trying to do here, but I'll take a shot at helping you. First of all, you can't have multiple <html>, <head>, and <body> tags on the same page. Only one set of these are allowed. Secondly, change the file type of menu2 to php instead of html if you want to include it there.
<style type="text/css">
.menu2 {
background-image: url('<?=$profpic;?>');
background-attachment:fixed;
position: absolute;
background: yellow;
}
</style>
<title>Hello</title>
</head>
<body>
<table width="100%" height="58%" border="0" cellspacing="0" cellpadding="2" class="heading">
<tr>
<td>
<?php include('menu.html');?>
</td>
</tr>
<tr>
<td><img src="pictures/logo.png" width="1335" height="300"></td>
</tr>
</table>
<table width="85%" height="1%" border="1" cellspacing="0" cellpadding="2">
<tr>
<td>
<?php include('menu2.php');?>
</td>
</tr>
</table>
<?php
$profpic = "pictures/bg.jpg";
?>
</body>
</html>
menu2.php
<div class="menu2">
//menu2 contents
</div>
I'm using DOMPDF to generate pdf files from html. PDF file is getting generated but there are many blank pages are appearing in between content. Following is my php code.
<?php
$html=file_get_contents("views/testnew.html");
// echo $html;die();
$paper_orientation = 'landscape';
ob_start();
require_once("dompdf/dompdf_config.inc.php");
$pdfcontent = $html;
$dompdf = new DOMPDF();
$dompdf->set_paper('A4', $paper_orientation);
$dompdf->load_html($pdfcontent);
$dompdf->render();
// $pdf = $dompdf->output();
$pdf=$dompdf->stream("my_pdf.pdf", array("Attachment" => 0));
// file_put_contents('Brochure.pdf', $pdf);
?>
Following is my HTML that is I'm writing in PDF file
http://jsfiddle.net/6RmmB/
Since PDF is getting generated I don't think there is any problem with PHP code. Something must be wrong in html, But not able to figure it out what exactly ?
Or I'm missing something in PHP code ?
Content next to "Employer identification number" is appearing after about 8-9 blank pages
This looks to be due to a bug in how dompdf handles paging of table cells. If you remove the outer table, which appears to only exist to supply a border, the page will render better. You may still need to tweak the structure/styling, however, to get exactly what you want.
For example, instead of this:
<table width="100%" border="0" cellpadding="0" cellspacing="0" id="" style="border:1px solid #ccc;color: #000;font-family: Arial,Helvetica,sans-serif;font-size:14px;">
<tr>
<td>
<table width="100%" cellspacing="0" cellpadding="0" border="0" style="border-bottom:1px solid #ccc">
<tr>
<td width="15%" align="left" valign="top" style="border-right:1px solid #ccc;padding:10px;line-height:20px">Form
<img src="/var/www/html/pm5/bodytechniques/working/development/version5/therapist/images/w9-form.JPG" width="83" height="37" style="margin-left:15px" />
<br>(Rev. August 2013)
<br>Department of the Treasury
<br>Internal Revenue Service</td>
<td width="69%" align="left" valign="top" style="border-right:1px solid #ccc;padding:10px;text-align:center;line-height:45px">
<h1 align="center">Request for Taxpayer Identification Number and Certification</h1>
</td>
<td width="16%" align="left" valign="top">
<h3 style="line-height:25px;padding:10px">Give Form to the requester. Do not send to the IRS</h3>
</td>
</tr>
</table>
</td>
</tr>
</table>
Do this:
<div style="border:1px solid #ccc;color: #000;font-family: Arial,Helvetica,sans-serif;font-size:14px;">
<table width="100%" cellspacing="0" cellpadding="0" border="0" style="border-bottom:1px solid #ccc">
<tr>
<td width="15%" align="left" valign="top" style="border-right:1px solid #ccc;padding:10px;line-height:20px">Form
<img src="/var/www/html/pm5/bodytechniques/working/development/version5/therapist/images/w9-form.JPG" width="83" height="37" style="margin-left:15px" />
<br>(Rev. August 2013)
<br>Department of the Treasury
<br>Internal Revenue Service</td>
<td width="69%" align="left" valign="top" style="border-right:1px solid #ccc;padding:10px;text-align:center;line-height:45px">
<h1 align="center">Request for Taxpayer Identification Number and Certification</h1>
</td>
<td width="16%" align="left" valign="top">
<h3 style="line-height:25px;padding:10px">Give Form to the requester. Do not send to the IRS</h3>
</td>
</tr>
</table>
</div>
I have problem when multiple tables doesn't fit to one page.
Solution for this is easy, add <div style="clear: both;"> after table.
I use tcpdf to generate pdf files.
And there's a problem in aligning image in table td.
I am uising $pdf->writeHTML($html, true, false, true, false, ''); in tcpdf.
html is clear from the image i have shared.
html is just simple as
<table>
<tr>
<td> </td>
<td>Picture</td>
.......
</tr>
<tr>
<td>1</td>
<td style="text-align:center"><img src="abc.jpg" width="20" height="20" ></td>
.......
</tr>
</table>
Note: align="center", valign="middle" , css margin and padding ... nothing seems to work I tried on
text-align:center push into center but not vertically.
Adding the following CSS to your td should work:
td {
vertical-align: middle;
text-align:center;
}
See a fiddle of it working.
Did you check image alignment?
<img align=center src="abc.jpg" width="20" height="20" >
This will work. As shown below, we can add a line break inside the <p> tag.
<table width="100%" style="border:1px solid #000;">
<tr>
<td style="text-align: center;">
<p><br/>
<img src="path/to/image" />
</p>
</td>
</tr>
</table>
you can use :
CSS:
td img{
margin:0 auto;
}
or use like #gayan