<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxgrid.css">
<link rel="stylesheet" type="text/css" href="../../codebase/skins/dhtmlxgrid_dhx_skyblue.css">
<script src="../../codebase/dhtmlxcommon.js" type="text/javascript"></script>
<script src="../../codebase/dhtmlxgrid.js" type="text/javascript"></script>
<script src="../../codebase/dhtmlxgridcell.js" type="text/javascript"></script>
<script src="../../codebase/ext/dhtmlxgrid_filter.js" type="text/javascript"></script>
<style>
div.gridbox div.ftr td{
text-align:right;
background-color:#E5F2F8;
border-right:0px solid gray;
}
div.gridbox_light table.hdr td {
text-align:center;
}
</style>
<div id="gridbox" style="width: 600px; height: 350px; background-color:white;"></div>
<script>mygrid = new dhtmlXGridObject('gridbox');
mygrid.setSkin("dhx_skyblue");
mygrid.setImagePath("../../codebase/imgs/");
mygrid.setHeader("Sales,Book Title,Author,Price,In Store,Shipping,Bestseller,Date of Publication");
mygrid.attachHeader("1,2,3,#numeric_filter,#master_checkbox,6,stat,8");
mygrid.setInitWidths("50,170,100,80,80,80,80,200");
mygrid.setColAlign("right,left,left,right,center,left,center,center");
mygrid.setColTypes("dyn,edtxt,ed,price,ch,co,ra,ro");
mygrid.init();
mygrid.attachFooter(' ${#stat_total},Total sales,-,#cspan,#cspan,#cspan,#cspan,#cspan');
mygrid.attachFooter('{#stat_max},Max sales,-,#cspan,#cspan,#cspan,#cspan,#cspan');
mygrid.attachFooter('{#stat_min},Min sales,-,#cspan,#cspan,#cspan,#cspan,#cspan');
mygrid.attachFooter('{#stat_average},Average sales,-,#cspan,#cspan,#cspan,#cspan,#cspan');
mygrid.attachFooter('{#stat_count},Count of rows,-,#cspan,#cspan,#cspan,#cspan,#cspan');
mygrid.attachFooter('${#stat_multi_total}0:3,Total sum (Sales*Price),-,#cspan,#cspan,#cspan,#cspan,#cspan');
mygrid.loadXML("../common/grid_08_filtering.xml");
</script>