How to make right border table tcpdf smaller? - php

I try to create tcpdf using writeHTML like this $pdf->writeHTML($html, true, 0, false, 0); which $html value like code below
<table border="1">
<tr>
<td width="100%" colspan="4">
<table border="0">
<tr>
<td width="18%" style="border-right:0.01px">Test 1</td>
<td width="12%">Test 2</td>
<td width="20%">Test 3</td>
</tr>
<tr>
<td width="18%" style="border-right:0.01px">Test 4</td>
<td width="12%">Test 5</td>
<td width="20%">Test 6</td>
</tr>
</table>
</td>
</tr>
</table>
style="border-right:0.01px" or style="border-right:0.1px" or style="border-right:1px" provide same result of border width, how to make this right border smaller? because my result rigth border on Test 1 and Test 4 are biggest then outside border.


If you're a little more explicit in your border definition it'll work as you expect. TCPDF's HTML/CSS parser is rather limited so it helps to be as specific as possible with your styling rules and the like.
Your code should work with either border-right-width: 0.1px or with the rest of CSS properties for the shorthand of border-right, see the example HTML below and accompanying screenshot of a rendered PDF (zoomed to highlight difference)
<table border="1">
<tr>
<td width="100%" colspan="4">
<table border="0">
<tr>
<!-- This should work -->
<td width="18%" style="border-right-width:0.1px;">Test 1</td>
<td width="12%">Test 2</td>
<td width="20%">Test 3</td>
</tr>
<tr>
<!-- As should this -->
<td width="18%" style="border-right:0.1px solid black;">Test 4</td>
<td width="12%">Test 5</td>
<td width="20%">Test 6</td>
</tr>
<tr>
<!-- However, this does not. -->
<td width="18%" style="border-right:0.1px">Test Broken</td>
<td width="12%">Test :)</td>
<td width="20%">Test :)</td>
</tr>
</table>
</td>
</tr>
</table>
As you can see, it handles the first two definitions as expected with thinner borders.


I use style="border-right-color:white" to hidden right border
<td style="border-right-color:white; border-bottom-color:black; border-top-color:black"></td>

Related

Set While loop in FPDF

This is code is using to generate pdf file. I using $html to do the table and will display in pdf file. But now if insert the while loop in the $html, the output is the php code and got some error. I confusing the single quotes to closing the code.
$html='<br><br><br>
<table border="1">
<tr>
<td bgcolor="#D0D0FF">Product Name</td>
<td bgcolor="#D0D0FF">Product Price</td>
<td bgcolor="#D0D0FF">Product Quantity</td>
<td bgcolor="#D0D0FF">Total Price</td>
</tr>
//Here
</table>`
<br>
<table border="1">
<tr>
<td bgcolor="#D0D0FF">Order Date</td>
<td width="600">'.$row['Order_Date'].'</td>
</tr>
<tr>
<td bgcolor="#D0D0FF">Tracking ID</td>
<td width="600">'.$row['Tracking_ID'].'</td>
</tr>
<tr>
<td bgcolor="#D0D0FF">Recipient</td>
<td width="600">'.$row['Tracking_Recipient'].'</td>
</tr>
<tr>
<td bgcolor="#D0D0FF">Phone Number</td>
<td width="600">'.$row['Tracking_PhoneNumber'].'</td>
</tr>
<tr>
<td bgcolor="#D0D0FF">Address</td>
<td width="600">'.$row['Tracking_Address'].'</td>
</tr>
<tr>
<td bgcolor="#D0D0FF">Bank</td>
<td width="600">'.$row['Bank'].'</td>
</tr>
</table>';
//While loop

Styling table generated by PHP foreach with jQuery

I am trying to style a <tr id="options"> generated by a PHP foreach() with jQuery, but everything I've tried only selects the first one, leaving the others intact. What can I do this? Simple example:
CSS:
td {border:1px solid black}
TABLE:
<table>
<tr>
<td>DATE</td>
<td>EXAM TITLE</td>
<td>EXAM CODE</td>
</tr>
<tr>
<td>TODAY</td>
<td>RANDOM</td>
<td>123</td>
</tr>
<tr>
<td>BUTTON</td>
<td>BUTTON</td>
<td>BUTTON</td>
</tr>
<tr>
<td colspan=3 id="options">
</tr>
I have tried this jQuery code (among other):
$("table").find("#options").each(function(){
$(this).css("border","0px");
});
It only styles my first <td id="options">. How can I get all of them?
Sorry if it is a stupid question. Thanks for the help.

convert id to classlike:- <td class="options">..</td>
and then you can use(Use Either-one)
CSS (standered way):-
td.options {border:1px solid black}
Or jQuery(try to avoid as much as possible):-
$('.options').css("border","1px solid black"); // no need of each
Example (both at same time):-
$('.options').css("font-size","21px");
td.options {border:1px solid black}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
<td class="options">DATE</td>
<td class="options">EXAM TITLE</td>
<td class="options">EXAM CODE</td>
</tr>
<tr>
<td class="options">TODAY</td>
<td class="options">RANDOM</td>
<td class="options">123</td>
</tr>
<tr>
<td class="options">BUTTON</td>
<td class="options">BUTTON</td>
<td class="options">BUTTON</td>
</tr>
</table>

cannot display html table with TCPDF

Just want to display html table with TCPDF but getting errors instead.
Here is my code:
$tbl = <<<EOD
<table cellspacing="0" cellpadding="1" border="1">
<tr>
<td >
aaaaa
</td>
<td colspan="2" rowspan="2" >
bbbb
</td>
</tr>
<td rowspan="2">
hhhhh
</td>
</tr>
<tr>
<td>
iiii
</td>
<td>
jjjj
</td>
</tr>
</table>
EOD;
But when I replace my html table code with following html table code (from TCPDF examples), it displays correctly:
$tbl = <<<EOD
<table cellspacing="0" cellpadding="1" border="1">
<tr>
<td rowspan="3">COL 1 - ROW 1<br />COLSPAN 3</td>
<td>COL 2 - ROW 1</td>
<td>COL 3 - ROW 1</td>
</tr>
<tr>
<td rowspan="2">COL 2 - ROW 2 - COLSPAN 2<br />text line<br />text line</td>
<td>COL 3 - ROW 2</td>
</tr>
<tr>
<td>COL 3 - ROW 3</td>
</tr>
</table>
EOD;
Could you please check my html table code and help me to find the mistake.

After the first <tr>, you have an extra </tr>, making the document invalid. Indented, your HTML is:
<table cellspacing="0" cellpadding="1" border="1">
<tr>
<td>aaaaa</td>
<td colspan="2" rowspan="2">bbbb</td>
</tr>
<td rowspan="2">hhhhh</td>
</tr>
<tr>
<td>iiii</td>
<td>jjjj</td>
</tr>
</table>

Problems displaying rowspan in dompdf and cakephp

I have been searching through the Internet searching for a solution to my problem. I am currently using CakePhp + dompdf to generate a PDF. It works fine on normal tables, but when I add rowspans and colspans it creates the table but the borders are ruined.
This is my HTML markup for generating the PDF:
<style>table{border-collapse:collapse;}.rows td{border:1px solid brown;</style>
<table class="sub_cat_table">
<tbody><tr class="rows">
<td colspan="2">カテゴリ</td>
<td>重要度</td>
<td>実現度</td>
<td colspan="2">項目（キーワード）</td>
<td colspan="2">重要度</td>
<td colspan="2">実現度</td>
<td colspan="2">格差</td>
</tr>
<tr class="rows">
<td rowspan="2" class="sub_cat_letter"> A </td>
<td rowspan="2" class="sub_cat_name">Situation</td>
<td rowspan="2" class="sub_cat_imp">3.5</td>
<td rowspan="2" class="sub_cat_pos">2.0</td>
</tr>
<tr class="rows">
<td class="sub_cat_number">1</td>
<td class="sub_cat_name">Complete</td>
<td class="sub_cat_imp_inner">3.0</td>
<td class="sub_cat_imp_inner"></td>
<td class="sub_cat_imp_inner">2.0</td>
<td class="sub_cat_imp_inner"> ●</td>
<td class="sub_cat_imp_inner">-1</td>
<td class="sub_cat_imp_inner"></td>
</tr>
<tr class="rows">
<td class="sub_cat_number">2</td>
<td class="sub_cat_name">Access</td>
<td class="sub_cat_imp_inner">4.0</td>
<td class="sub_cat_imp_inner"></td>
<td class="sub_cat_imp_inner">2.0</td>
<td class="sub_cat_imp_inner">● </td>
<td class="sub_cat_imp_inner">-2</td>
<td class="sub_cat_imp_inner"></td>
</tr>
<tr class="rows">
<td rowspan="3" class="sub_cat_letter">B</td>
<td rowspan="3" class="sub_cat_name">Technology</td>
<td rowspan="3" class="sub_cat_imp">3.4</td>
<td rowspan="3" class="sub_cat_pos">1.9</td>
</tr>
<tr class="rows">
<td class="sub_cat_number">3</td>
<td class="sub_cat_name">Quality</td>
<td class="sub_cat_imp_inner">3.7</td>
<td class="sub_cat_imp_inner"></td>
<td class="sub_cat_imp_inner">1.7</td>
<td class="sub_cat_imp_inner"></td>
<td class="sub_cat_imp_inner">-2</td>
<td class="sub_cat_imp_inner">▼ </td>
</tr>
<tr class="rows">
<td class="sub_cat_number">4</td>
<td class="sub_cat_name">Access</td>
<td class="sub_cat_imp_inner">3.0</td>
<td class="sub_cat_imp_inner"></td>
<td class="sub_cat_imp_inner">2.0</td>
<td class="sub_cat_imp_inner">● </td>
<td class="sub_cat_imp_inner">-1</td>
<td class="sub_cat_imp_inner"></td>
</tr>
</tbody>
</table>
Print screen in HTML (sorry, the table has border above):
Print screen in generating PDF in dompdf:
I've been trying to play with the file dompdf/includes/cellmap.cls.php, but I can't get it to work.
I already tried these solutions here:
https://code.google.com/p/dompdf/issues/detail?id=361
https://code.google.com/p/dompdf/issues/detail?id=342
And some links I already forgot. Any advice or workaround is very much appreciated.

I think you don't need to change your dompdf to create PDF, You just need to arrange your table specially the row span rule. When creating a table using row span it should be like this:
<table border="1">
<tr>
<td rowspan="3"> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table>

Its really not much of an "answer" but i suggest switching using tcpdf. I have found it does the best overall job of rendering html to pdf, its also some what easier to customise than other pdf libraries.
code used to generate example:
<?php
// Include the main TCPDF library (search for installation path).
require_once('../tcpdf.php');
// create new PDF document
$pdf = new TCPDF(PDF_PAGE_ORIENTATION, PDF_UNIT, PDF_PAGE_FORMAT, true, 'UTF-8', false);
// set default monospaced font
$pdf->SetDefaultMonospacedFont(PDF_FONT_MONOSPACED);
// set margins
$pdf->SetMargins(PDF_MARGIN_LEFT, PDF_MARGIN_TOP, PDF_MARGIN_RIGHT);
$pdf->SetHeaderMargin(PDF_MARGIN_HEADER);
$pdf->SetFooterMargin(PDF_MARGIN_FOOTER);
// set auto page breaks
$pdf->SetAutoPageBreak(TRUE, PDF_MARGIN_BOTTOM);
// set image scale factor
$pdf->setImageScale(PDF_IMAGE_SCALE_RATIO);
// set some language-dependent strings (optional)
if (file_exists(dirname(__FILE__).'/lang/eng.php')) {
require_once(dirname(__FILE__).'/lang/eng.php');
$pdf->setLanguageArray($l);
}
// ---------------------------------------------------------
// set default font subsetting mode
$pdf->setFontSubsetting(true);
// Set font
// dejavusans is a UTF-8 Unicode font, if you only need to
// print standard ASCII chars, you can use core fonts like
// helvetica or times to reduce file size.
$pdf->SetFont('dejavusans', '', 6, '', true);
// Add a page
// This method has several options, check the source code documentation for more information.
$pdf->AddPage();
// set text shadow effect
//$pdf->setTextShadow(array('enabled'=>true, 'depth_w'=>0.2, 'depth_h'=>0.2, 'color'=>array(196,196,196), 'opacity'=>1, 'blend_mode'=>'Normal'));
// Set some content to print
$html = <<<EOD
<style>table{border-collapse:collapse;}.rows td{border:1px solid brown;</style>
<table class="sub_cat_table">
<tbody><tr class="rows">
<td colspan="2">カテゴリ</td>
<td>重要度</td>
<td>実現度</td>
<td colspan="2">項目（キーワード）</td>
<td colspan="2">重要度</td>
<td colspan="2">実現度</td>
<td colspan="2">格差</td>
</tr>
<tr class="rows">
<td rowspan="2" class="sub_cat_letter"> A </td>
<td rowspan="2" class="sub_cat_name">Situation</td>
<td rowspan="2" class="sub_cat_imp">3.5</td>
<td rowspan="2" class="sub_cat_pos">2.0</td>
</tr>
<tr class="rows">
<td class="sub_cat_number">1</td>
<td class="sub_cat_name">Complete</td>
<td class="sub_cat_imp_inner">3.0</td>
<td class="sub_cat_imp_inner"></td>
<td class="sub_cat_imp_inner">2.0</td>
<td class="sub_cat_imp_inner"> ●</td>
<td class="sub_cat_imp_inner">-1</td>
<td class="sub_cat_imp_inner"></td>
</tr>
<tr class="rows">
<td class="sub_cat_number">2</td>
<td class="sub_cat_name">Access</td>
<td class="sub_cat_imp_inner">4.0</td>
<td class="sub_cat_imp_inner"></td>
<td class="sub_cat_imp_inner">2.0</td>
<td class="sub_cat_imp_inner">● </td>
<td class="sub_cat_imp_inner">-2</td>
<td class="sub_cat_imp_inner"></td>
</tr>
<tr class="rows">
<td rowspan="3" class="sub_cat_letter">B</td>
<td rowspan="3" class="sub_cat_name">Technology</td>
<td rowspan="3" class="sub_cat_imp">3.4</td>
<td rowspan="3" class="sub_cat_pos">1.9</td>
</tr>
<tr class="rows">
<td class="sub_cat_number">3</td>
<td class="sub_cat_name">Quality</td>
<td class="sub_cat_imp_inner">3.7</td>
<td class="sub_cat_imp_inner"></td>
<td class="sub_cat_imp_inner">1.7</td>
<td class="sub_cat_imp_inner"></td>
<td class="sub_cat_imp_inner">-2</td>
<td class="sub_cat_imp_inner">▼ </td>
</tr>
<tr class="rows">
<td class="sub_cat_number">4</td>
<td class="sub_cat_name">Access</td>
<td class="sub_cat_imp_inner">3.0</td>
<td class="sub_cat_imp_inner"></td>
<td class="sub_cat_imp_inner">2.0</td>
<td class="sub_cat_imp_inner">● </td>
<td class="sub_cat_imp_inner">-1</td>
<td class="sub_cat_imp_inner"></td>
</tr>
</tbody>
</table>
EOD;
// Print text using writeHTMLCell()
$pdf->writeHTMLCell(0, 0, '', '', $html, 0, 1, 0, true, '', true);
// ---------------------------------------------------------
// Close and output PDF document
// This method has several options, check the source code documentation for more information.
$pdf->Output('example_001.pdf', 'I');
//============================================================+
// END OF FILE
//============================================================+

You just need to use rowspan correctly, you must add the rest of the columns in the same row, here is the code to create the table as you wish.
table {
border-collapse: collapse;
}
.rows td {
border: 1px solid brown;
}
<table class="sub_cat_table">
<tbody>
<tr class="rows">
<td colspan="2">カテゴリ</td>
<td>重要度</td>
<td>実現度</td>
<td colspan="2">項目（キーワード）</td>
<td colspan="2">重要度</td>
<td colspan="2">実現度</td>
<td colspan="2">格差</td>
</tr>
<tr class="rows">
<td rowspan="2" class="sub_cat_letter"> A </td>
<td rowspan="2" class="sub_cat_name">Situation</td>
<td rowspan="2" class="sub_cat_imp">3.5</td>
<td rowspan="2" class="sub_cat_pos">2.0</td>
<td class="sub_cat_number">1</td>
<td class="sub_cat_name">Complete</td>
<td class="sub_cat_imp_inner">3.0</td>
<td class="sub_cat_imp_inner"> </td>
<td class="sub_cat_imp_inner">2.0</td>
<td class="sub_cat_imp_inner"> ●</td>
<td class="sub_cat_imp_inner">-1</td>
<td class="sub_cat_imp_inner"></td>
</tr>
<tr class="rows">
<td class="sub_cat_number">2</td>
<td class="sub_cat_name">Access</td>
<td class="sub_cat_imp_inner">4.0</td>
<td class="sub_cat_imp_inner"> </td>
<td class="sub_cat_imp_inner">2.0</td>
<td class="sub_cat_imp_inner">● </td>
<td class="sub_cat_imp_inner">-2</td>
<td class="sub_cat_imp_inner"></td>
</tr>
<tr class="rows">
<td rowspan="2" class="sub_cat_letter">B</td>
<td rowspan="2" class="sub_cat_name">Technology</td>
<td rowspan="2" class="sub_cat_imp">3.4</td>
<td rowspan="2" class="sub_cat_pos">1.9</td>
<td class="sub_cat_number">3</td>
<td class="sub_cat_name">Quality</td>
<td class="sub_cat_imp_inner">3.7</td>
<td class="sub_cat_imp_inner"> </td>
<td class="sub_cat_imp_inner">1.7</td>
<td class="sub_cat_imp_inner"> </td>
<td class="sub_cat_imp_inner">-2</td>
<td class="sub_cat_imp_inner">▼ </td>
</tr>
<tr class="rows">
<td class="sub_cat_number">4</td>
<td class="sub_cat_name">Access</td>
<td class="sub_cat_imp_inner">3.0</td>
<td class="sub_cat_imp_inner"> </td>
<td class="sub_cat_imp_inner">2.0</td>
<td class="sub_cat_imp_inner">● </td>
<td class="sub_cat_imp_inner">-1</td>
<td class="sub_cat_imp_inner"> </td>
</tr>
</tbody>
</table>

Xpath nested tables

I have a Table, see Code. Its a table that has a table in it, so its nested. Now i want to get all vales of the parent table only and then all values of the child table.
To get the childs data i can do this:
$query = '//*[#id="WordClass"]/table[2]/tr/td[2]/table/tr';
$nodes = $xpath->query($query);
foreach ($nodes as $node) { //do more querys to get the td data and save it..
My problem is how to only get the data of the parent table without getting the child data/tr/td also.
<table cellpadding="0" cellspacing="0" border="0">
<tbody>
<tr valign="top">
<td>
<table cellpadding="1" cellspacing="2" border="0">
<tr>
<td class="colTitle" align="center" colspan="4">
Da Titel
</td>
</tr>
<tr>
<td class="colTitle" align="center" colspan="2">One
</td>
<td class="colTitle" align="center" colspan="2">Two
I
</td>
</tr>
<tr>
<td class="colSubTitle">Pe</td>
<td class="colSubTitle">Ve</td>
<td class="colSubTitle">Pe</td>
<td class="colSubTitle">Ve</td>
</tr>
<tr>
<td class="rowTitle">x</td>
<td class="colVerbDef">y</td>
<td class="rowTitle">z</td>
<td class="colVerbDef">c</td>
</tr>
<tr>
<td class="rowTitle">r</td>
<td class="colVerbDef">t</td>
<td class="rowTitle">z</td>
<td class="colVerbDef">z</td>
</tr>
</table>
</td>
<td>
<table cellpadding="1" cellspacing="2" border="0">
<tr>
<td class="colTitle" align="center" colspan="4">
Da Titel2
</td>
</tr>
<tr>
<td class="colTitle" align="center" colspan="2">One
</td>
<td class="colTitle" align="center" colspan="2">Two
I
</td>
</tr>
<tr>
<td class="colSubTitle">Pe2</td>
<td class="colSubTitle">Ve2</td>
<td class="colSubTitle">Pe2</td>
<td class="colSubTitle">Ve2</td>
</tr>
<tr>
<td class="rowTitle">x2</td>
<td class="colVerbDef">y2</td>
<td class="rowTitle">z2</td>
<td class="colVerbDef">c2</td>
</tr>
<tr>
<td class="rowTitle">r2</td>
<td class="colVerbDef">t2</td>
<td class="rowTitle">z2</td>
<td class="colVerbDef">z2</td>
</tr>
</table>
</td>
</tr>
</tbody>

You can get the contents of the parent table's td elements using a direct path from the root:
/table/tbody/tr/td
The contents of those cells happen to be another table element, but you can strip those out with DOMDocument.
To get the inner tables' td elements only excluding the parents, you can look for tables that have a td parent, then select its tds:
//td/table//td
If I've misunderstood your question, please feel free to explain further and I will update.

Categories