Print PDF dengan menggunakan library TCPDF
Script PHP Print PDF dengan menggunakan library TCPDF - TCPDF merupakan library yang sering digunakan dalam aplikasi berbasis web untuk proses print out data dari database, yang biasanya digunakan sebagai berkas data berupa print outnya.
Pada kesempatan kali ini saya akan membahas tentang cara bagaiaman membuat fungsi print dengan menggunakan library tcpdf. Pada tutorial ini saya menggunakan juga framework bootstrap agar lebih mempercantik tampilannya.
Pada kesempatan kali ini saya akan membahas tentang cara bagaiaman membuat fungsi print dengan menggunakan library tcpdf. Pada tutorial ini saya menggunakan juga framework bootstrap agar lebih mempercantik tampilannya.
Untuk mempersingkat pembahasan silahkan simak tutorial Print PDF dengan menggunakan library TCPDF berikut ini.
1. Pertama silahkan anda buat folder di xampp/htdocs/(nama folder), disini saya membuat folder dengan nama tutorial_print. Sebelumnya saya telah membuat database dengan nama y_inventory dengan tb_jual sebagai contoh data yang akan kita print out dengan menggunakan library tcpdf.
(Untuk databasenya silahkan anda download juga pada akhir tutorial ini, saya satukan dengan file pendukung lainnya) Berikut adalah gambar dari database yang saya buat.
1. Pertama silahkan anda buat folder di xampp/htdocs/(nama folder), disini saya membuat folder dengan nama tutorial_print. Sebelumnya saya telah membuat database dengan nama y_inventory dengan tb_jual sebagai contoh data yang akan kita print out dengan menggunakan library tcpdf.
(Untuk databasenya silahkan anda download juga pada akhir tutorial ini, saya satukan dengan file pendukung lainnya) Berikut adalah gambar dari database yang saya buat.
2. Kemudian pada htdocs/tutorial_print saya membuat folder dan page seperti yang ada pada gambar ini. (untuk library tcpdf, framework bootstrap dan pendukung tutorial kali ini anda bisa download di akhir postingan ini).
3. Buat file dengan nama index.php dan simpan di folder htdocs yang telah dibuat tadi, berikut adalah script nya.
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta charset="utf-8" />
<title>UD. Kondang Ksatria Niaga</title>
<meta name="description" content="" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<!-- bootstrap & fontawesome -->
<link rel="stylesheet" href="assets/css/bootstrap.min.css" />
<link rel="stylesheet" href="assets/font-awesome/4.5.0/css/font-awesome.min.css" />
<!-- page specific plugin styles -->
<!-- text fonts -->
<link rel="stylesheet" href="assets/css/fonts.googleapis.com.css" />
<!-- ace styles -->
<link rel="stylesheet" href="assets/css/ace.min.css" class="ace-main-stylesheet" id="main-ace-style" />
<!--[if lte IE 9]>
<link rel="stylesheet" href="assets/css/ace-part2.min.css" class="ace-main-stylesheet" />
<![endif]-->
<link rel="stylesheet" href="assets/css/ace-skins.min.css" />
<link rel="stylesheet" href="assets/css/ace-rtl.min.css" />
<!--[if lte IE 9]>
<link rel="stylesheet" href="assets/css/ace-ie.min.css" />
<![endif]-->
<!-- inline styles related to this page -->
<!-- ace settings handler -->
<script src="assets/js/ace-extra.min.js"></script>
<script src="assets/js/jquery-2.1.4.min.js"></script>
<!-- HTML5shiv and Respond.js for IE8 to support HTML5 elements and media queries -->
<!--[if lte IE 8]>
<script src="assets/js/html5shiv.min.js"></script>
<script src="assets/js/respond.min.js"></script>
<![endif]--><head>
</head>
<div class="page-header">
<h1>Data<small><i class="ace-icon fa fa-angle-double-right"></i> Penjualan <i class="ace-icon fa fa-angle-double-right"></i>
<a type="button" class="label label-lg label-danger arrowed-in arrowed-right" href="print-data-jual.php" target="_blank"> Print </a></small>
</h1>
</div>
<?php
include "config/koneksi.php";
$tampilJua =mysql_query("SELECT * FROM tb_jual ORDER BY id_jual DESC");
?>
<div class="row">
<div class="col-xs-12">
<div class="row">
<div class="col-xs-12">
<div class="table-header"> Results <u><?php echo mysql_num_rows($tampilJua)?></u> rows for "Data Penjualan"</div>
<div>
<table id="dynamic-table" class="table table-striped table-bordered table-hover">
<thead>
<tr>
<th class="center"><label class="pos-rel"><input type="checkbox" class="ace" /><span class="lbl"></span></label></th>
<th><i class="ace-icon fa fa-lock bigger-110 hidden-480"></i> Invoice</th>
<th>Tanggal</th>
<th>Agen</th>
<th>Produk</th>
<th>Jumlah</th>
<th></th>
</tr>
</thead>
<tbody>
<?php
while($jua =mysql_fetch_array($tampilJua)){
?>
<tr>
<td class="center"><label class="pos-rel"><input type="checkbox" class="ace" /><span class="lbl"></span></label></td>
<td><?php echo $jua['invoice']?></td>
<td><?php echo $jua['tgl']?></td>
<td><?php $tampilAge =mysql_query("SELECT * FROM tb_agen WHERE id_agen='$jua[id_agen]'");
$age =mysql_fetch_array($tampilAge);
echo $age['nama']
?>
</td>
<td><?php $tampilPro =mysql_query("SELECT * FROM tb_produk WHERE id_produk='$jua[id_produk]'");
$pro =mysql_fetch_array($tampilPro);
echo $pro['nama']
?> <?php echo $pro['ukuran']?>
</td>
<td><?php echo $jua['jml']?> </td>
<td class="center"> </td>
</tr>
<?php
}
?>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<!-- page specific plugin scripts -->
<script src="assets/js/jquery.dataTables.min.js"></script>
<script src="assets/js/jquery.dataTables.bootstrap.min.js"></script>
<script src="assets/js/dataTables.buttons.min.js"></script>
<script src="assets/js/buttons.flash.min.js"></script>
<script src="assets/js/buttons.html5.min.js"></script>
<script src="assets/js/buttons.print.min.js"></script>
<script src="assets/js/buttons.colVis.min.js"></script>
<script src="assets/js/dataTables.select.min.js"></script>
<!-- inline scripts related to this page -->
<script type="text/javascript">
jQuery(function($) {
//initiate dataTables plugin
var myTable =
$('#dynamic-table')
//.wrap("<div class='dataTables_borderWrap' />") //if you are applying horizontal scrolling (sScrollX)
.DataTable( {
bAutoWidth: false,
"aoColumns": [
{ "bSortable": false },
null, null,null, null, null,
{ "bSortable": false }
],
"aaSorting": [],
select: {
style: 'multi'
}
} );
$.fn.dataTable.Buttons.defaults.dom.container.className = 'dt-buttons btn-overlap btn-group btn-overlap';
myTable.on( 'select', function ( e, dt, type, index ) {
if ( type === 'row' ) {
$( myTable.row( index ).node() ).find('input:checkbox').prop('checked', true);
}
} );
myTable.on( 'deselect', function ( e, dt, type, index ) {
if ( type === 'row' ) {
$( myTable.row( index ).node() ).find('input:checkbox').prop('checked', false);
}
} );
//table checkboxes
$('th input[type=checkbox], td input[type=checkbox]').prop('checked', false);
//select/deselect all rows according to table header checkbox
$('#dynamic-table > thead > tr > th input[type=checkbox], #dynamic-table_wrapper input[type=checkbox]').eq(0).on('click', function(){
var th_checked = this.checked;//checkbox inside "TH" table header
$('#dynamic-table').find('tbody > tr').each(function(){
var row = this;
if(th_checked) myTable.row(row).select();
else myTable.row(row).deselect();
});
});
//select/deselect a row when the checkbox is checked/unchecked
$('#dynamic-table').on('click', 'td input[type=checkbox]' , function(){
var row = $(this).closest('tr').get(0);
if(this.checked) myTable.row(row).deselect();
else myTable.row(row).select();
});
$(document).on('click', '#dynamic-table .dropdown-toggle', function(e) {
e.stopImmediatePropagation();
e.stopPropagation();
e.preventDefault();
});
//And for the first simple table, which doesn't have TableTools or dataTables
//select/deselect all rows according to table header checkbox
var active_class = 'active';
$('#simple-table > thead > tr > th input[type=checkbox]').eq(0).on('click', function(){
var th_checked = this.checked;//checkbox inside "TH" table header
$(this).closest('table').find('tbody > tr').each(function(){
var row = this;
if(th_checked) $(row).addClass(active_class).find('input[type=checkbox]').eq(0).prop('checked', true);
else $(row).removeClass(active_class).find('input[type=checkbox]').eq(0).prop('checked', false);
});
});
//select/deselect a row when the checkbox is checked/unchecked
$('#simple-table').on('click', 'td input[type=checkbox]' , function(){
var $row = $(this).closest('tr');
if($row.is('.detail-row ')) return;
if(this.checked) $row.addClass(active_class);
else $row.removeClass(active_class);
});
/********************************/
//add tooltip for small view action buttons in dropdown menu
$('[data-rel="tooltip"]').tooltip({placement: tooltip_placement});
//tooltip placement on right or left
function tooltip_placement(context, source) {
var $source = $(source);
var $parent = $source.closest('table')
var off1 = $parent.offset();
var w1 = $parent.width();
var off2 = $source.offset();
//var w2 = $source.width();
if( parseInt(off2.left) < parseInt(off1.left) + parseInt(w1 / 2) ) return 'right';
return 'left';
}
/***************/
$('.show-details-btn').on('click', function(e) {
e.preventDefault();
$(this).closest('tr').next().toggleClass('open');
$(this).find(ace.vars['.icon']).toggleClass('fa-angle-double-down').toggleClass('fa-angle-double-up');
});
/***************/
/**
//add horizontal scrollbars to a simple table
$('#simple-table').css({'width':'2000px', 'max-width': 'none'}).wrap('<div style="width: 1000px;" />').parent().ace_scroll(
{
horizontal: true,
styleClass: 'scroll-top scroll-dark scroll-visible',//show the scrollbars on top(default is bottom)
size: 2000,
mouseWheelLock: true
}
).css('padding-top', '12px');
*/
})
</script>
<script> // 500 = 0,5 s
$(document).ready(function(){setTimeout(function(){$(".pesan").fadeIn('slow');}, 500);});
setTimeout(function(){$(".pesan").fadeOut('slow');}, 7000);
</script>
4. Buat juga file dengan nama print-data-jual.php dan simpan di folder tutorial_print, berikut adalah script nya.
<?php
ob_start();
include'assets/tcpdf/tcpdf.php';
class MYPDF extends TCPDF {
public function Header() {
// Logo
//$image_file = K_PATH_IMAGES.'logo_example.jpg';
//$this->Image($image_file, 10, 10, 15, '', 'JPG', '', 'T', false, 300, '', false, false, 0, false, false, false);
// Header
//$html = '<p align="center"></p>';
//$this->writeHTMLCell($w = 0, $h = 0, $x = '', $y = 10, $html, $border = 0, $ln = 1, $fill = 0, $reseth = true, $align = 'top', $autopadding = true);
}
public function Footer() {
// Position at 15 mm from bottom
$this->SetY(-15);
// Set font
$this->SetFont('helvetica', 'I', 8);
// Page number
$this->Cell(0, 10, 'Page '.$this->getAliasNumPage().'/'.$this->getAliasNbPages().' '.'*** '.date ("d-m-Y").' ***', 0, false, 'C', 0, '', 0, false, 'T', 'M');
}
}
$pdf = new MYPDF('L', 'mm', 'A4', true, 'UTF-8', false);
// set document information
$pdf->SetCreator(PDF_CREATOR);
$pdf->SetAuthor('Andi Hatmoko');
$pdf->SetTitle('Report');
$pdf->SetSubject('TCPDF');
$pdf->SetKeywords('TCPDF, PDF, example, test, guide');
// set default header data
$pdf->SetHeaderData(PDF_HEADER_LOGO, PDF_HEADER_LOGO_WIDTH, PDF_HEADER_TITLE, PDF_HEADER_STRING);
// set header and footer fonts
$pdf->setHeaderFont(Array(PDF_FONT_NAME_MAIN, '', PDF_FONT_SIZE_MAIN));
$pdf->setFooterFont(Array(PDF_FONT_NAME_DATA, '', PDF_FONT_SIZE_DATA));
// set default monospaced font
$pdf->SetDefaultMonospacedFont(PDF_FONT_MONOSPACED);
// set margins
$pdf->SetMargins(12, 20, 12);
$pdf->SetHeaderMargin(PDF_MARGIN_HEADER);
$pdf->SetFooterMargin(PDF_MARGIN_FOOTER);
// set auto page breaks
$pdf->SetAutoPageBreak(TRUE, 20);
// 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);
}
// add a page
$pdf->AddPage();
$pdf->SetFont('helvetica', '', 10);
include "config/koneksi.php";
$tampilJua =mysql_query("SELECT * FROM tb_jual ORDER BY id_jual DESC");
$header = '<table border="0" cellspacing="0" cellpadding="3">
<tr>
<td rowspan="2" width="120" align="center"><img src="assets/images/avatars/logo.jpg" width="60" height="60" /></td>
<td width="830"><font size="12">DATA PENJUALAN</font></td>
</tr>
<tr>
<td> </td>
</tr>
</table><br /><br />
<table border="2" cellspacing="0" cellpadding="3">
</table><br />';
$pdf->writeHTMLCell($w = 0, $h = 0, $x = '', $y = 12, $header, $border = 0, $ln = 1, $fill = 0, $reseth = true, $align = 'top', $autopadding = true);
$html ='<table border="1" cellspacing="0" cellpadding="3">
<tr>
<td width="40" align="center"> <b># ID</b></td>
<td width="160"> <b>Invoice</b></td>
<td width="100"> <b>Tanggal</b></td>
<td width="200"> <b>Supplier</b></td>
<td width="160"> <b>Bahan</b></td>
<td width="100"> <b>Harga</b></td>
<td width="100"> <b>Jumlah</b></td>
<td width="100"> <b>Total</b></td>
</tr>';
while($jua =mysql_fetch_array($tampilJua)){
$html .='<tr>
<td align="center"> '.$jua['id_jual'].'</td>
<td> '.$jua['invoice'].'</td>
<td> '.$jua['tgl'].'</td>';
$tampilAge =mysql_query("SELECT * FROM tb_agen WHERE id_agen='$jua[id_agen]'");
$age =mysql_fetch_array($tampilAge);
$html .='<td> '.$age['nama'].'</td>';
$tampilPro =mysql_query("SELECT * FROM tb_produk WHERE id_produk='$jua[id_produk]'");
$pro =mysql_fetch_array($tampilPro);
$total =$jua['jml']*$jua['hrg'];
$html .='<td> '.$pro['nama'].'</td>
<td align="right"> '.number_format($jua['hrg'],0,",",",").'</td>
<td> '.$jua['jml'].'</td>
<td align="right"> '.number_format($total,0,",",",").'</td>
</tr>';
}
$html .='</table>';
$pdf->writeHTML($html, true, false, false, false, '');
//Close and output PDF document
$pdf->Output('Penjualan '.date("Y").'.pdf', 'I');
?>
5. Selanjutnya kita buat file koneksi untuk mengakses databasenya, disni saya membuat file dengan nama koneksi.php, yang saya simpan di folder config. Berikut ada script koneksi.php nya.
<?php
$Open = mysql_connect("localhost","root","");
if (!$Open){
die ("Koneksi ke Engine MySQL Gagal !<br>");
}
$Koneksi = mysql_select_db("y_inventory");
if (!$Koneksi){
die ("Koneksi ke Database Gagal !");
}
?>
6. Jika semuanya sudah selesai silahkan melakukan pemanggilan melalui browser yang anda gunakan dengan cara localhost/tutorial_print dan akan muncul tampilan seperti berikut ini. Ini merupakan tampilan tabel yang akan kita print out dengan menggunakan library tcpdf.
7. Klik print, dan hasilnya akan tampak seperti gambar berikut. Ini adalah hasil pemanfaat library print pdf dengan menggunakan bahasa php.
Silahkan untuk di pelajari, semoga apa yang saya berikan pada tutorial kali ini bermanfaat dan dapat dipahami. Apabila ada link yang tidak befungsi atau ada yang kurang dipahami silahkan hubungi admin melalui kolom komentar.
Download file library tcpdf dan pendukung lainnya untuk totorial ini di SINI.
Terimakasih.
makasih gan, membantu skli
ReplyDeleteok gan, silahkan untuk di pelajari
Delete