This example demonstrates how to perform AJAX loading with SubReport. Sub Report is actually a full functional report and it is defined a sub report within a main one.
In this example, The CustomerOrders is the main report and it includes CutomerSelecing and ListOrders as its two subreports. If you have a big report, we can break this report into smaller easy-to-handle sub reports. In this way, you can manage reports easier.
The most powerful features of sub report is its ability to load on-demand via ajax request. So let imagine your have a big report combined from small sub reports, you can load those sub reports dynamically. In above example, the CustomerSelecting helps to select customers and ListOrders will display orders of selected customers. All are without page refreshing.
The SubReport is a built-in feature of KoolReport.
<?php
require_once "../../../load.koolreport.php";
require_once "CustomerOrders.php";
$report = new CustomerOrders;
$report->run()->render();
<?php
require "CustomerSelecting.php";
require "ListOrders.php";
class CustomerOrders extends \koolreport\KoolReport
{
use \koolreport\core\SubReport;
function settings()
{
return array(
"subReports"=>array(
"customerselecting"=>CustomerSelecting::class,
"listorders"=>ListOrders::class,
)
);
}
}
<div class="report-content">
<div class="text-center">
<h1>Customer Orders</h1>
<p class="lead">Select customer then display their orders</p>
</div>
<div class="row">
<div class="col-md-8 offset-md-2">
<?php $this->subReport("customerselecting"); ?>
</div>
</div>
<?php $this->subReport("listorders"); ?>
</div>
<?php
class CustomerSelecting extends \koolreport\KoolReport
{
use \koolreport\inputs\Bindable;
use \koolreport\inputs\POSTBinding;
protected function defaultParamValues()
{
return array(
"country"=>null,
"customer"=>null,
);
}
protected function bindParamsToInputs()
{
return array(
"country",
"customer"
);
}
function settings()
{
$config = include "../../../config.php";
return array(
"dataSources"=>array(
"automaker"=>$config["automaker"],
),
);
}
function setup()
{
$this->src("automaker")->query("
SELECT country from customers GROUP BY country
")->pipe($this->dataStore("countries"));
if($this->params["country"]!=null)
{
$this->src("automaker")->query("
SELECT customerNumber, customerName from customers
WHERE
country=:country
")
->params(array(
":country"=>$this->params["country"],
))
->pipe($this->dataStore("customers"));
}
}
}
<?php
use \koolreport\inputs\Select;
?>
<div class="form-group">
<label>Select country:</label>
<?php
Select::create(array(
"name"=>"country",
"dataStore"=>$this->dataStore("countries"),
"defaultOption"=>array("--"=>null),
"dataBind"=>"country",
"clientEvents"=>array(
"change"=>"function(){
subReport.update('customerselecting',{
country:$('#country').val(),
});
subReport.update('listorders');
}",
),
"attributes"=>array(
"class"=>"form-control",
)
));
?>
</div>
<?php
if($this->params["country"])
{
?>
<div class="form-group">
<label>Select customer in <?php echo $this->params["country"]; ?>:</label>
<?php
Select::create(array(
"name"=>"customer",
"dataStore"=>$this->dataStore("customers"),
"defaultOption"=>array("--"=>null),
"dataBind"=>array(
"text"=>"customerName",
"value"=>"customerNumber"
),
"clientEvents"=>array(
"change"=>"function(){
subReport.update('customerselecting',{
country:$('#country').val(),
customer:$('#customer').val(),
});
}",
),
"attributes"=>array(
"class"=>"form-control",
)
));
?>
</div>
<?php
}
?>
<?php
if(isset($this->params["customer"]) && $this->params["customer"]!=null)
{
?>
<div class="form-group text-center">
<button onclick="listOrders()" class="btn btn-success">List Orders</button>
</div>
<?php
}
?>
<script type="text/javascript">
function listOrders()
{
subReport.update("listorders",{
"customerNumber":$('#customer').val(),
});
}
</script>
<?php
class ListOrders extends \koolreport\KoolReport
{
function settings()
{
return array(
"dataSources"=>array(
"automaker"=>array(
"connectionString"=>"mysql:host=localhost;dbname=automaker",
"username"=>"root",
"password"=>"",
"charset"=>"utf8"
),
),
);
}
function setup()
{
if(isset($this->params["customerNumber"]))
{
$this->src("automaker")
->query("
SELECT orderNumber,orderDate,status FROM orders
WHERE
customerNumber = :customerNumber
")
->params(array(
":customerNumber"=>$this->params["customerNumber"],
))
->pipe($this->dataStore("orders"));
}
}
}
<?php
use \koolreport\widgets\koolphp\Table;
use \koolreport\datagrid\DataTables;
?>
<?php
// Table::create(array(
DataTables::create(array(
"dataStore"=>isset($this->params["customerNumber"])?$this->dataStore("orders"):[],
// "data"=>isset($this->params["customerNumber"])?null:array(),
"plugins" => ["Buttons", "FixedColumns", "FixedHeader", "KeyTable", "Responsive", "RowReorder", "Scroller", "SearchPanes"],
"options" => array(
"dom" => 'Blfrtip',
"buttons" => [
[
"extend" => 'pdfHtml5',
"orientation" => "landscape",
"pageSize" => "A6",
],
"copy", "csv", "excel", "print", "colvis"
],
"searching"=>true,
"paging" => true
),
"columns"=>array(
"orderNumber"=>array(
"label"=>"Order Number"
),
"orderDate"=>array(
"label"=>"Order Date",
),
"status"=>array(
"label"=>"Status",
)
),
"cssClass"=>array(
"table"=>"table table-bordered table-striped table-hover"
)
));
?>
