Ketika membuat sebuah aplikasi tentu tak lepas dari proses mencetak laporan. Karena kebutuhan untuk pelaporan mengharuskan cetak printer dari laporan yang dibuat.
untuk membuat cetak laporan yang nyaman buat pengguna, biasanya dengan membuka tab kosong di samping halaman aktif. untuk mengkombinasikan hal tersebut, bisa menggunakan PHP dan javascript. contoh program sebagai berikut :
1. Membuat fungsi javascript :
<script>
function getExportData(){
var id = document.getElementById('k').value; //parameter yang dikirim
var k = document.getElementById('l').value;
var t = document.getElementById('t').value;
var url = 'urlFile_cetak?m='+btoa(id)+'&k='+btoa(k)+'&t='+btoa(t);
//menambahkan btoa untuk mengenskripsi value parameter
var printWindow = window.open(url, '_blank');
printWindow.onload = function() {
var isIE = /(MSIE|Trident\/|Edge\/)/i.test(navigator.userAgent);
if (isIE) {
printWindow.print();
setTimeout(function () { printWindow.close(); }, 100);
} else {
setTimeout(function () {
printWindow.print();
var ival = setInterval(function() {
printWindow.close();
clearInterval(ival);
}, 200);
}, 500);
}
}
}
</script>
2 Membuat File hasil cetakan (value url diisikan dengan nama file yang dibuat, dan pastikan path nya betul)
3. Silahkan membuat tombol cetak.
<section class="panel panel-success">
<div class="alert alert-warning">
<span class="alert-icon"><i class="fa fa-search"></i></span>
<div class="notification-info"> Kelurahan :
<select name="k" id="k" class="js-example-basic-single"
style="text-align:left; width:75%">
<option value="0">Semua</option>
</select>
</div>
<br>
<div class="notification-info"> Kegiatan :
<select name="l" id="l" class="js-example-basic-single"
style="text-align:left; width:75%">
<option value="0">Semua</option>
</select>
</div>
<br>
<div class="notification-info"> Tahun :
<select name="t" id="t" class="js-example-basic-single"
style="text-align:left; width:25%">
</select>  
<button onClick="javascript:LoadSearchData()" class="btn btn-success">
<i class="fa fa-search"></i> SELEKSI | </button>
<input type="hidden" name="proses" value="seleksi">
<a href="javascript:getExportData();" ><button class="btn btn-primary">
<i class="fa fa-print"></i> Cetak</button></a>
</div>
</div>
</section>
Tidak ada komentar:
Posting Komentar