control2div.php
<?php include "inc/header_inc.php"; ?>
<?php //include "inc/dbkool.php"; ?>
<?php include "inc/ajax.php"; ?>
<form id="form1" method="post">
<script type="text/javascript" src="<?php echo $KoolControlsFolder; ?>/KoolAjax/koolajax_extension.js"></script>
<style>
#target {
width:655px;
border:dotted 1px gray;
min-height:50px;
padding:10px;
}
</style>
<div id="target"></div>
<script type="text/javascript">
function load_treeview() {
koolajax.load("tree.php",handle_ondone);
}
function load_listbox() {
koolajax.load("listbox.php",handle_ondone);
}
function load_grid() {
//document.write('<div>Grid should be here</div>');
koolajax.load("gridbasic.php",handle_ondone);
}
function handle_ondone(result) {
var _target = document.getElementById("target");
_target.innerHTML = result;
run_script_in_element("target");//This function is inside koolajax_extension.js
}
</script>
<input type="button" value="Load TreeView" onclick="load_treeview()" />
<input type="button" value="Load ListBox" onclick="load_listbox()" />
<input type="button" value="Load Grid" onclick="load_grid()" />
</form>
</body></HTML>Now, the grid PHP file:
1. Does not need the ajax control since it is in the control2div.php file
2. Does need the environment variables (I have mine in inc/gvars.php)
3. Does the connection to the database set up inc/dbkool.php
4. Notice the $koolajax->Render() should not be there! (it's comented out)
<?php
require_once "inc/gvars.php";
include_once "inc/dbkool.php";
require $KoolControlsFolder."/KoolGrid/koolgrid.php";
$lvl1Datasource = new MySQLDataSource($db_con);
$lvl1sql="select customerNumber,customerName,phone,city from customers";
$lvl1Datasource->SelectCommand = $lvl1sql;
$lvl2Datasource = new MySQLDataSource($db_con);
$lvl2sql="select orderNumber,orderDate,status,customerNumber from orders";
$lvl2Datasource->SelectCommand = $lvl2sql;
$lvl3Datasource = new MySQLDataSource($db_con);
$lvl3sql="select orderNumber,productName,quantityOrdered,priceEach from orderdetails,products where orderdetails.productCode=products.productCode";
$lvl3Datasource->SelectCommand = $lvl3sql;
$grid = new KoolGrid("grid");
$grid->scriptFolder = $KoolControlsFolder."/KoolGrid";
$grid->styleFolder="default";
$grid->Width = "655px";
$grid->RowAlternative = true;
$grid->AjaxEnabled = true;
$grid->AjaxLoadingImage = $KoolControlsFolder."/KoolAjax/loading/5.gif";
//LEVEL 3 TABLE
$lvl3Table = new GridTableView();
$lvl3Table->Width = "100%";
$lvl3Table->DataSource = $lvl3Datasource;
$lvl3Table->AddRelationField("orderNumber","orderNumber");
$lvl3Table->AutoGenerateColumns = true;//Auto Generate all column from tables
$lvl3Table->DisableAutoGenerateDataFields = "orderNumber";//Disable generate column for orderNumber data fields.
//LEVEL 2 TABLE
$lvl2Table = new GridTableView();
$lvl2Table->Width = "100%";
$lvl2Table->DataSource =$lvl2Datasource;
$lvl2Table->AddRelationField("customerNumber","customerNumber");
$lvl2Table->AutoGenerateExpandColumn = true;
$lvl2Table->AutoGenerateColumns = true;
$lvl2Table->DisableAutoGenerateDataFields = "customerNumber";
$lvl2Table->AddDetailTable($lvl3Table);
//MASTER TABLE
$grid->MasterTable->DataSource = $lvl1Datasource;
$grid->MasterTable->AutoGenerateExpandColumn = true;
$grid->MasterTable->AutoGenerateColumns = true;
$grid->MasterTable->AddDetailTable($lvl2Table);
$grid->MasterTable->Pager = new GridPrevNextAndNumericPager();
$grid->Process();
//echo $koolajax->Render();
echo $grid->Render();
?>