I have a HTML code like this:
<div id="invoice">
<div id="invoice-header"> <img alt="Mainlogo_large" class="logo screen" src="http://colosus.com/invoice/images/freeagent_logo.png">
<!-- hCard microformat -->
<div class="vcard" id="company-address">
<div class="fn org"><strong>KIOSBAN.COM</strong></div>
<div class="adr">
<div class="street-address">Gedung Atlantica Lt.4<br>
Jl. Kuningan Barat No. 7, Mampang<br>
</div>
<!-- street-address -->
<div class="locality">Indonesia</div>
<div id="company-postcode"><span class="region">Jakarta Selatan</span> <span class="postal-code">12710</span></div>
</div>
<!-- adr -->
<div class="email">fajar#kiosban.com</div>
<div id="sales-tax-reg-number">Fajar tampan</div>
</div>
<!-- company-address vcard -->
</div>
<!-- #invoice-header -->
<div id="invoice-info">
<h2>Invoice <strong>INV001</strong></h2>
<h3>21 February 2008</h3>
<p id="payment-terms">Payment Terms: 30 days</p>
<p id="payment-due">Payment due by 21 March 2008</p>
<p id="payment-total">£2643.75</p>
</div>
<!-- #invoice-info -->
<div class="vcard" id="client-details">
<div class="fn">John Doe</div>
<div class="org">Client Company</div>
<div class="adr">
<div class="street-address"> Client Street Address<br>
Street Address 2<br>
Street Address 3<br>
</div>
<!-- street-address -->
<div class="locality">LOCALITY</div>
<div id="client-postcode"><span class="region">Region</span> <span class="postal-code">MV2 8SX</span></div>
<div id="your-tax-number">SALES TAX: 193528491</div>
</div>
<!-- adr -->
</div>
<!-- #client-details vcard -->
<table id="invoice-amount">
<thead>
<tr id="header_row">
<th class="quantity_th">Quantity</th>
<th class="left details_th">Details</th>
<th class="unitprice_th">Unit Price (£)</th>
<th class="salestax_th">VAT</th>
<th class="subtotal_th">Net Subtotal (£)</th>
</tr>
</thead>
<tfoot>
<tr id="discount_tr">
<td colspan="2"> </td>
<td colspan="2" class="item_r">10% Discount</td>
<td class="item_r">£250.00</td>
</tr>
<tr id="net_total_tr">
<td colspan="2"> </td>
<td colspan="2" class="item_r">Net Total</td>
<td class="item_r">2250.00</td>
</tr>
<tr id="vat_tr">
<td colspan="2"> </td>
<td colspan="2" class="item_r">VAT</td>
<td class="item_r">393.75</td>
</tr>
<tr id="total_tr">
<td colspan="2"> </td>
<td colspan="2" class="total" id="total_currency"><span class="currency">GBP </span> Total</td>
<td class="total">£2643.75</td>
</tr>
</tfoot>
<tbody>
<tr class="item odd">
<td class="item_l">1 Day</td>
<td class="item_l">Details of project activity to be billed </td>
<td class="item_r">500.00</td>
<td class="item_r">17.5%</td>
<td class="item_r">500.00</td>
</tr>
<tr class="item">
<td class="item_l">2 Days</td>
<td class="item_l">Other Details of project activity to be billed </td>
<td class="item_r">1000.00</td>
<td class="item_r">17.5%</td>
<td class="item_r">1000.00</td>
</tr>
<tr class="item odd">
<td class="item_l">2 Days</td>
<td class="item_l">More d etails of project activity to be billed </td>
<td class="item_r">1500.00</td>
<td class="item_r">17.5%</td>
<td class="item_r">1000.00</td>
</tr>
</tbody>
</table>
<!-- invoice-amount -->
<div id="invoice-other">
<h2>Other Information</h2>
<div id="company-reg-number"><strong>Company Registration Number:</strong> 9273109</div>
<div id="contract-number"><strong>Contract/PO:</strong> PO 87227643</div>
</div>
<!-- invoice-other -->
<div id="payment-details">
<h2>Payment Details</h2>
<div id="bank_name">Bank Name</div>
<div id="sort-code"><strong>Bank/Sort Code:</strong> 32-75-97</div>
<div id="account-number"><strong>Account Number:</strong> 28270761</div>
<div id="iban"><strong>IBAN:</strong> 973547</div>
<div id="bic"><strong>BIC:</strong> 220197</div>
<div id="payment-reference"><strong>Payment Reference:</strong> INV001</div>
</div>
<!-- payment-details -->
<div id="comments">Payment should be made by bank transfer or cheque made payable to John Smith.</div>
<!-- comments -->
</div>
My question is: how to convert that HTML code only element inside <div id='invoice'>bla bla bla</div> or maybe just the specified url of that page (ex: localhost/invoice/index.php) to a downloadable pdf?
I've been searching many pdf class libraries but I can't find a solution.
Can anyone give me a solution, idea or possible approach?
You can use this service http://pdfmyurl.com/ to have PDF downloaded for urls, like having them in this format - http://pdfmyurl.com/?url=http://facebook.com
I would recommend using Zend_Pdf, it can be given a page which is used as the template for the PDF and you can do all sorts of PDF stuff.
Try mPDF it is a great and easy to use tool. And you can take a look on this quick start tutorial smaizys.com
Try TCPDF http://www.tcpdf.org/ . It is a php class for generating pdfs. Read http://www.tcpdf.org/examples/example_006.phps
I suggest to used DOMPDF.
[https://github.com/dompdf/dompdf][1]
it had huge problems with tables. I factored out my large nested tables and it helped (before it was just consuming up to 128M of memory then dying--thats my limit on memory in php.ini) but it makes a complete mess of tables and doesn't seem to get images. The tables were just basic stuff with some border styles to add some lines at various points;
Related
I want to use a PDF converter for my Laravel project so I thought Dompdf might be a good idea. I managed to get it to work to convert a simple invoice file. However when I wanted to structured my invoice more with tables tag and others to make it look nicer, it wouldn't convert for me and throws a:
domPDF exception: frame not found in cellmap
Here is my invoice.blade.php for reference:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Invoice</title>
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" />
</head>
<body>
<div class="container">
<div class="card">
<div class="card-header">
<span class="float-left " > <img src="{{ asset('images/Logo.png') }}" style="width:60%;" alt="No Logo"></span>
<div class="float-center">
<h4>DC Signature Livingstyle SDN BHD</h4>
<small> 1-21-01,Menara Bangkok Bank,Berjaya Central Park,No 105,Jalan Ampang,50450 Kuala Lumpur,Malaysia </small><br>
<small>603-02818821 bujishu#gmail.com www.bujishu.com </small>
</div>
<div class="float-right">
<strong>Invoice:[Invoice Number]</strong>
<br>
<strong>[Date Placeholder]</strong> <br>
<strong>Credit Term:[Cash]</strong>
</div>
</div>
<div class="card-body">
<div class="row mb-4">
<div class="col-sm-6">
<h6 class="mb-3">From:</h6>
<div>
<strong>[Panel Name]</strong>
</div>
<div>[Address 1]</div>
<div>[Address 2]</div>
<div>Email:[panel_email]</div>
<div>Phone: [panel_number]</div>
</div>
<div class="col-sm-6">
<h6 class="mb-3">To:</h6>
<div>
<strong>[Customer Name]</strong>
</div>
<div> [Shipping address 1] </div>
<div>[shipping address 2]</div>
<div>Email:[customer_email]</div>
<div>Phone: [customer_number]</div>
</div>
</div>
<div class="table-responsive-sm">
<table class="table table-striped">
<thead>
<tr>
<th class="center">No</th>
<th>Item</th>
<th>Description</th>
<th class="left">Quantity</th>
<th class="center">Unit Price (RM)</th>
<th class="right">Amount(RM)</th>
</tr>
</thead>
<tbody>
<tr>
<td class="center">1</td>
<td class="left strong">Electrical wire</td>
<td class="left">Longest wire ever</td>
<td class="center">1</td>
<td class="left">999,00</td>
<td class="right">999,00</td>
</tr>
<tr>
<td class="center">2</td>
<td class="left">Interior design</td>
<td class="left">Instalation and Customization (cost per hour)</td>
<td class="left">20</td>
<td class="center">150</td>
<td class="right">3.000,00</td>
</tr>
<tr>
<td class="center">3</td>
<td class="left">Table</td>
<td class="left">Round table</td>
<td class="left">1</td>
<td class="center">499,00</td>
<td class="right">499,00</td>
</tr>
</tbody>
</table>
</div>
<div class="row">
<div class="col-lg-4 col-sm-5 ml-auto " >
<table class="table table-clear ">
<th><strong> Payment Received </strong></th>
<tbody>
<tr>
<td class="left">
Payment Method: xxxxxx
</td>
</tr>
<tr>
<td class="left">
Reference No: 2192012
</td>
</tr>
<tr>
<td class="left">
Amount Paid: RM10,000.00
</td>
</tr>
<tbody>
</table>
</div>
<div class="col-lg-4 col-sm-5 ml-auto">
<table class="table table-clear">
<tbody>
<tr>
<td class="left">
<strong>Subtotal</strong>
</td>
<td class="right">8.497,00</td>
</tr>
<tr>
<td class="left">
<strong>Transportation(Klang Valley)</strong>
</td>
<td class="right">xxxxx</td>
</tr>
<tr>
<td class="left">
<strong>Grand Total</strong>
</td>
<td class="right">8.497,00</td>
</tr>
<tr>
<td class="left">
<strong>Discount (20%)</strong>
</td>
<td class="right">1,699,40</td>
</tr>
<tr>
<td class="left">
<strong>Amount Paid</strong>
</td>
<td class="right">679,76</td>
</tr>
<tr>
<td class="left">
<strong>Balance Due</strong>
</td>
<td class="right">
<strong>7.477,36</strong>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<h6 style="margin-left:30%;">This invoice is computer generated,no signature is required.</h6>
</div>
</div>
</body>
</html>
Does anyone know how to resolve this?
Edit:
Validator returns this:
Error: Bad value {{ asset('css/app.css') }} for attribute href on element link: Illegal character in path segment: { is not allowed.
From line 8, column 2; to line 8, column 58
</title>↩ <link href="{{ asset('css/app.css') }}" rel="stylesheet"> ↩↩
Error: Bad value {{ asset('images/Logo.png') }} for attribute src on element img: Illegal character in path segment: { is not allowed.
From line 18, column 37; to line 18, column 111
-left " > <img src="{{ asset('images/Logo.png') }}" style="width:60%;" alt="No Logo"></span
Error: th start tag in table body.
From line 112, column 43; to line 113, column 12
e-clear ">↩ <th><stron
i am new in both php and jquery. i want to use span to hide and show content in html and php. can i use jquery? if yes, what should i do? i already put the jquery script to the bottom of page. this is my code :
<!-- reply -->
<span title="fas fa-reply" name="reply" data-id="1"
</span>
<!-- if span clicked show all these data... -->
<table class="table table-borderless" style="margin-top:50px;">
<thead class="bg-secondary pb-0">
<tr>
<th colspan="3" class="pb-0">
<p class="test text-light">Creating Reply <?php echo $rowAllPost["id"]; ?>
</p></th>
<th class="pb-0 text-right">
</th>
</tr>
</thead>
<th scope="row" style="width:15rem!important;">
<img src="<?php echo $rowViewUserNow["picture"];?>" class="rounded-circle" style=height:93px;width:81px;><br>
<p class="ml-3"> Online</p>
<p class="ml-2"> <?php echo $rowViewUserNow["username"];?>
</p>
<i class="fas fa-info-circle pr-2 pt-2"></i>Active
<td colspan="3" class="text-justify">
<form action="controller/doCheckPost.php" method="post">
<textarea name="description" class="form-control"></textarea>
</td>
</tr>
<tr class="bg-secondary pb-0" >
<th colspan="3" class="pb-0">
<button title="Cancel" class="btn" type="submit" name="cancel"><i class="fas fa-times"></i></th></button>
<th class= "pb-0 text-right">
<button title="Submit" class="btn" name="submit"><i class="fas fa-check"></i></button>
</form>
</th>
</th>
</tr>
</div>
</tbody>
</table>
The best way would be to first give an id to both the span and table elements. Then you can use an event handler in jQuery like this:
$('#spanId').on('click', function() {
$('#tableId').toggle();
});
Toggle will show the element if it's hidden and hide it if it's visible.
The following:
Frame not found in cellmap
https://github.com/dompdf/dompdf/issues/657
Is a well know problem on the internet. But I can't find a solution
for the problem. I'm trying to convert my html template to pdf. When I remove the <table> it's working. Otherwise it throws an exception.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Example 2</title>
<link rel="stylesheet" href="/administration/style.css" media="all" />
</head>
<body>
<header class="clearfix">
<div id="logo">
<img src="/administration/logo.png">
</div>
<div id="company">
<h2 class="name">Company Name</h2>
<div>455 Foggy Heights, AZ 85004, US</div>
<div>(602) 519-0450</div>
<div>company#example.com</div>
</div>
</div>
</header>
<main>
<div id="details" class="clearfix">
<div id="client">
<div class="to">INVOICE TO:</div>
<h2 class="name">John Doe</h2>
<div class="address">796 Silver Harbour, TX 79273, US</div>
<div class="email">john#example.com</div>
</div>
<div id="invoice">
<h1>INVOICE 3-2-1</h1>
<div class="date">Date of Invoice: 01/06/2014</div>
<div class="date">Due Date: 30/06/2014</div>
</div>
</div>
<table border="0" cellspacing="0" cellpadding="0">
<thead>
<tr>
<th class="no">#</th>
<th class="desc">DESCRIPTION</th>
<th class="unit">UNIT PRICE</th>
<th class="qty">QUANTITY</th>
<th class="total">TOTAL</th>
</tr>
</thead>
<tbody>
<tr>
<td class="no">01</td>
<td class="desc"><h3>Website Design</h3>Creating a recognizable design solution based on the company's existing visual identity</td>
<td class="unit">$40.00</td>
<td class="qty">30</td>
<td class="total">$1,200.00</td>
</tr>
<tr>
<td class="no">02</td>
<td class="desc"><h3>Website Development</h3>Developing a Content Management System-based Website</td>
<td class="unit">$40.00</td>
<td class="qty">80</td>
<td class="total">$3,200.00</td>
</tr>
<tr>
<td class="no">03</td>
<td class="desc"><h3>Search Engines Optimization</h3>Optimize the site for search engines (SEO)</td>
<td class="unit">$40.00</td>
<td class="qty">20</td>
<td class="total">$800.00</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="1"></td>
<td colspan="1">SUBTOTAL</td>
<td>$5,200.00</td>
</tr>
<tr>
<td colspan="1"></td>
<td colspan="1">TAX 25%</td>
<td>$1,300.00</td>
</tr>
<tr>
<td colspan="1"></td>
<td colspan="1">GRAND TOTAL</td>
<td>$6,500.00</td>
</tr>
</tfoot>
</table>
<div id="thanks">Thank you!</div>
<div id="notices">
<div>NOTICE:</div>
<div class="notice">A finance charge of 1.5% will be made on unpaid balances after 30 days.</div>
</div>
</main>
<footer>
Invoice was created on a computer and is valid without the signature and seal.
</footer>
</body>
</html>
I had a similar problem, but was able to discover that I had an extra < in one of my text items (the text was entered by a user, so they had an age question that was like Are you < 21 years old. Make sure you escape these (in PHP, use htmlentities).
This can also happen with invalid html or an extra HTML tag. I looked through your <table> above and ran it through dompdf, but it didn't throw the error, so perhaps you had an errant < in your code that was not copied to StackOverflow?
SOLUTION:
use this:
$orientation = 'landscape';
$customPaper = array(0,0,950,950);
$this->setPaper($customPaper, $orientation);
how to give the spacing between each cell in a table and make it like a different making a table in HTML.
i want to make it like a cells becoming table by combining it all together.
code:
like shown tabs in the www.quickr.com
<table class="table" width=100% cellspacing="3px" style="border-spacing:10px; ">
<tr>
<!--<td bgcolor="#FF0000">-->
<!--<td bgcolor="#F3E9AF" height="200px" width="350px" style="padding: 74px;">-->
<td style="padding: -7px;">
<!--<td bgcolor="#99E7F7">-->
<div class="column col-md-4">
<div id="c-830" class="block">
<h4><img src="images/categories/rent_7.png" height=110 width=150 style="margin-top: -5px">
<a href="#">
<strong style="color: #343434;">Rent</strong>
</a>
</h4>
<div>
</div>
</div>
</div>
</td>
<td style="padding: -35px;">
<!--<td bgcolor="#004488">-->
<div class="column col-md-4">
<div id="c-362" class="block">
<h4><img src="images/categories/buy_6.png" height=110 width=150 style="margin-top: -3px">
<a href="#">
<strong style="color: #343434;">Buy</strong>
</a>
</h4>
<div>
</div>
</div> </div>
</td>
<td style="padding: -23px;">
<div class="column col-md-4">
<div id="c-833" class="block">
<h4><img src="images/categories/sell_tag.png" height=110 width=150 style="margin-top: -5px">
<a href="#">
<strong style="color: #343434;">Sell</strong>
</a>
</h4>
<div>
</div>
</div>
</div>
</td>
</tr>
</table>
Try to give a table name and then you could add for td/tr in css a padding or border-spacing.
Try this .. by using cellpadding="value" & cellspacing="value"
Check this: Fiddle Demo
Try this .. by using
<table cellpadding="15" cellspacing="15">
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
</table>
so i have this html table:
$table = '<table cellpadding="0" cellspacing="0" class="calendar">
<tr>
<th>Sun</th>
<th>Mon</th>
<th>Tue</th>
<th>Wed</th>
<th>Thu</th>
<th>Fri</th>
<th>Sat</th>
</tr>
<tr>
<td> </td>
<td data-date="12/01/2014">
<div class="wrapper">
<div class="day">1</div>
</div>
</td>
<td data-date="12/02/2014">
<div class="wrapper">
<div class="day">2</div>
</div>
</td>
<td data-date="12/03/2014">
<div class="wrapper">
<div class="day">3</div>
</div>
</td>
<td data-date="12/04/2014" class="green">
<div class="wrapper">
<div class="day">4</div>
</div>
</td>
<td data-date="12/05/2014" class="green">
<div class="wrapper">
<div class="day">5</div>
</div>
</td>
<td data-date="12/06/2014" class="green">
<div class="wrapper">
<div class="day">6</div>
</div>
</td>
</tr>
<tr>
<td data-date="12/07/2014" class="green">
<div class="wrapper">
<div class="day">7</div>
</div>
</td>
<td data-date="12/08/2014" class="green">
<div class="wrapper">
<div class="day">8</div>
</div>
</td>
<td data-date="12/09/2014" class="green">
<div class="wrapper">
<div class="day">9</div>
</div>
</td>
<td data-date="12/10/2014" class="green">
<div class="wrapper">
<div class="day">10</div>
</div>
</td>
<td data-date="12/11/2014" class="green">
<div class="wrapper">
<div class="day">11</div>
</div>
</td>
<td data-date="12/12/2014">
<div class="wrapper">
<div class="day">12</div>
</div>
</td>
<td data-date="12/13/2014">
<div class="wrapper">
<div class="day">13</div>
</div>
</td>
</tr>
</table>';
i want to get the date inside data-date property in tag <td> which has no property class="green". the valid results expected are:
12/01/2014
12/02/2014
12/03/2014
12/12/2014
12/13/2014
(they are not have property class="green")
this my code:
preg_match_all('/<td[^>]*data-date="(.*?)">(.*?)<\/td>/', $table, $tag, PREG_PATTERN_ORDER);
print_r($tag);
however the regex i used is still match with tag <td> which has property class="green". since i want to exclude theme, what is the correct regex?
need your advise, thank you for helping.
<td[^>]*data-date="[^"]*"(?:(?!class="green"|>).)*>(.*?)<\/td>
Try this.See demo.
https://regex101.com/r/dU7oN5/9
I try this :
/<td[^>]*data-date="([0-9\/]+)">(.*?)<\/td>/s
and it looks like it does the job,
Use https://fr.functions-online.com/preg_match_all.html to test your regexp ;)
Sorry for my english