Get paid to share your links!

HTML

Membuat Laporan PDF dengan PHP menggunakan library dompdf

Kalau postingan sebelumnya saya berikan tentang membuat laporan pada framework CodeIgniter, kali ini saya akan buat dalam bahasa pemograman PHP :).

1. Langsung saja, dowload library dompdfnya (kalau yang udah baca postingan sebelumnya ga usah lagi, sama kok librarynya hehee)

2. sekarang buat sebuah file php yang akan kita buat kedalam pdf. isinya terserah deh. trus simpan, kasi nama report_html.php

3. buat file php untuk reportnya, simpan dengan nama report.php. isi reportnya seperti ini

<?
    require_once("dompdf/dompdf_config.inc.php");
    spl_autoload_register('DOMPDF_autoload');
    function pdf_create($html, $filename, $paper, $orientation, $stream=TRUE)
    {
        $dompdf = new DOMPDF();
        $dompdf->set_paper($paper,$orientation);
        $dompdf->load_html($html);
        $dompdf->render();
        $dompdf->stream($filename.".pdf");
    }
    $filename = 'berbagiarea';
    $dompdf = new DOMPDF();
    $html = file_get_contents('report_html.php');
    pdf_create($html,$filename,'A4','portrait');
?>


4. terakhir panggil report.php di browser dan anda akan memperoleh file php nya :)

program lengkapnya download disini.
dishare ya :)

Script Javascript : menampilkan dan menyembunyikan sebuah element html (Display/Hide)

Bisa tidak kita buat sebuah input box, tetapi munculnya setelah element button di beri event/diklik ? 
Jawabannya, Bis. Kita bisa membuatnya baik itu dengan JavaScript, JQuery, dan dengan bantuan HTML
Design layoutnya kira-kira akan seperti Gambar 1 dan hasilnya pada Gambar 2.

Gambar 1
Gambar 2
Nah, bagaimana membuatnya? 
Langkah umumnya seperti berikut ini :
1. Pertama kita buat layout yang terdiri dari button, dan input-text yang mau ditampilkan. 
2. Kemudian, set style="display:none;" pada attribut input-textnya. 
3. Selanjutnya, buat sebuah script javascriptnya. 
    function viewInput() {
        var e = document.getElementById('input_id');
        if(e.style.display == 'none')
        document.getElementById('input_id').style.display = "block"
        else
        document.getElementById('input_id').style.display = "none"
       
    }

4. Kode akhirnya akan seperti ini,
 

    <html>
    <head>
    <script type="text/javascript">
    function viewInput() {
        var e = document.getElementById('input_id');
        if(e.style.display == 'none')
        document.getElementById('input_id').style.display = "block"
        else
        document.getElementById('input_id').style.display = "none"
      
    }
    </script>
    </head>
    <body>
    <div style="width:50%;font-family:Helvetica Neue;margin-l   eft:auto;margin-right:auto;color:#da630b;">
        <button onclick="viewInput()" width="100px">Click Me</button>
        <input type="text" id="input_id" style="display:none;"/>
    </div>
    </body>
    </html> 

5. Terakhir, panggil file htmlnya di browser anda :) 


Download Kode lengkapnya disini. 
Terima kasih, bantu share ya :)

Older Posts