Code Samples

Thursday, May 18, 2017

jQuery UI Popup Dialog Simple Example

Its fairly easy to implement jQuery popup dialog. You just need to include jQuery UI JS and CSS in your project and need to call the method as follows:

.dialog() with additional options as you want.

$("#dialog-form").dialog({
    title: "Dialog Title",
    width: 500,
    height: 400,
    autoOpen: false,
    modal: true,
    buttons: {
        "Ok": function() {
            $('#buttonExecute').val("Show Dialog - Yes");
            $(this).dialog("close");
        },
        "Cancel": function() {
            $('#buttonExecute').val("Show Dialog - No");
            $(this).dialog("close");
        }
    },
    close: function( event, ui ) {
        console.log(event);
        console.log(ui);
    },
    open: function( event, ui ) {
        $('#buttonExecute').val("Show Dialog - Open");
    }
});

$('#buttonExecute').click(function() {
    $("#dialog-form").dialog("open");
});

Which will show dialog as below screenshot:

You can download full example from below link:

Click here to download.

Monday, May 15, 2017

How to add header/footer to multipage pdf on Laravel SnappyPDF WkHtmlToPdf

I am sure you already install WkhtmlToPDF with Snappy in your Laravel project. If not yet please visit the link below to install WkhtmltoPDF in your Laravel project:

Click here.

Now add margin for your page if not added yet because header and footer need some space to visible in PDF header and footer area by editing the file named "config/snappy.php".

<?php
return array(
'pdf' => array(
'enabled' => true,
'binary' => 'C:\PROGRA~1\wkhtmltopdf\bin\wkhtmltopdf.exe',
'timeout' => false,
'options' => array(
'margin-top' => 15,
'margin-right' => 8,
'margin-bottom' => 20,
'margin-left' => 5
),
'env' => array(),
),
'image' => array(
'enabled' => true,
'binary' => 'C:\PROGRA~1\wkhtmltopdf\bin\wkhtmltoimage.exe',
'timeout' => false,
'options' => array(),
'env' => array(),
)

);

And then append header and footer html in your PDF as follows:

$header_html = file_get_contents(resource_path() . "/" . "pdf-header.html");
$footer_html = file_get_contents(resource_path() . "/" . "pdf-footer.html");

$pdf = SnappyPDF::loadView('home.pdf');
$pdf->setOption('header-html', $header_html);
$pdf->setOption('footer-html', $footer_html);

return $pdf->stream('invoice.pdf');

You have to create two file named "pdf-header.html" and "pdf-footer.html" in your "resource" folder as below.

pdf-header.html:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body style="border: 1px solid blue;margin-left: 18px;margin-right: 0px;padding:10px">
<div style="color: red">
THIS IS <b>PAGE HEADER</b>
</div>
</body>

</html>

pdf-footer.html:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body style="border: 1px solid blue;margin-left: 18px;margin-right: 0px;padding:10px">
<div style="color: red">
THIS IS <b>PAGE FOOTER</b>
Page=<span id="page"></span>|
Total Page=<span id="topage"></span>|
Date=<span id="date"></span>|
Time=<span id="time"></span>
</div>
<script type="text/javascript">
var vars={};
var x=window.location.search.substring(1).split('&');
for (var i in x) {
var z=x[i].split('=',2);
vars[z[0]] = unescape(z[1]);
}
document.getElementById('page').innerHTML = vars.page;
document.getElementById('topage').innerHTML = vars.topage;
document.getElementById('date').innerHTML = vars.date;
document.getElementById('time').innerHTML = vars.time;
</script>
</body>

</html>

PDF will look like below images:

Saturday, May 13, 2017

Responsive CSS - It's Begining

Friday, May 12, 2017

Cakephp 3.X Get Database Table Columns From Model

TableRegistry::get("Test2")->getSchema()->columns()

CakePHP 3.X Get Database Table Name From Model

TableRegistry::get("Test2")->getTable();

CakePHP 3.X Sub Query Example

$sub_query = TableRegistry::get("Test2")->find();
$sub_query->select(["count" => "SUM(Test2.score)"])
->where(["Test2.ref = Test1.id"]);

$query = TableRegistry::get("Test1")->find("All");
$query->select([
"Test1.id", "Test1.name", "Test1.roll",
"score" => $sub_query
]);

$list = $query->all()->toArray();

PHP Calculate Percentage Value Which Includes In Amount Reverse Way

<?php
$amount = 500;
$percentage = 20;
$percentage_value = calculateReversePercentage($amount, $percentage);
echo "$percentage% of $amount (Includes) = $percentage_value";
$percentage_value = calculateForwardPercentage($amount, $percentage);
echo "<br/>$percentage% of $amount (Not Includes) = $percentage_value";

function calculateReversePercentage($amount, $percentage) {
    $percentage = round(($percentage / ((100 + $percentage) / $amount)) * 1, 2);
    return $percentage;
}

function calculateForwardPercentage($amount, $percentage) {
    $percentage = ($amount * $percentage) / 100;
    return $percentage;
}

Which will output as below:
20% of 500 (Includes) = 83.3320% of 500 (Not Includes) = 100

Pages