Grid full page height

Hello,

I am currently using the test version of ActiveWidgets, in order to see if we can use it in our company. I want to use the grid component and show it in a page, but with the full height of the page.
However, I can not get it working. I have tried different solutions I found on the forum, but I don't seem to find the right one.

This is my code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Opportunity Pipeline Analysis</title>

<style> 

td {

font-family: Verdana;

font-size: 11px;

}

th {

font-family: Verdana;

font-size: 12px;

font-weight: bold;

text-align: left;

white-space: nowrap;

}

 

#myGrid .aw-column-5 {text-align: right} /* align to the right */ 

#myGrid .aw-column-6 {text-align: right} /* align to the right */ 

#myGrid .aw-column-7 {text-align: right} /* align to the right */ 

#myGrid .aw-column-8 {text-align: right} /* align to the right */ 

#myGrid .aw-column-9 {text-align: right} /* align to the right */ 

#myGrid .aw-column-10 {text-align: right} /* align to the right */ 

#myGrid .aw-column-11 {text-align: right} /* align to the right */ 

a.aw-cells-normal:visited, a.aw-cells-normal:link, a.aw-cells-normal:hover { color: #F90; }

</style>

<script src="../../../../js/activeWidgets/lib/aw.js" type="text/javascript"></script>

<link href="../../../../js/activeWidgets/styles/system/aw.css" rel="stylesheet">

</head>

 

<body style="margin: 0; height: 100%;">

<script type="text/javascript"> 

var myData = [

    ["WWN-OPP000205","MES gekoppeld aan APS","WW","_MES","MES Project","","1",300.000,300.000,"20 %",60.000,"5637196768","wwn"]

    ,	["WWN-OPP000660","Koppeling Maintenance Productie","WW","55-00017","EAM Adapters for SAP PM 6.0","","1",8.440,8.440,"20 %",1.688,"5637227619","wwn"]

    ,	["WWN-OPP000660","Koppeling Maintenance Productie","WW","55-00020","Condition Based Monitoring, v2.0&nbsp;- 50 Eq","","1",8.865,8.865,"20 %",1.773,"5637227619","wwn"]

    

];

 

var myHeaders = ["Opp. #", "Opp. name", "Brand", "Item #","Item description","Exp. order date","Qty","Value piece","Value unweighed","Probability","Value weighed","RecId","DataAreaId"];

 

</script>

 

<div id="myGrid" style="width: 100%; height:100%; table-layout: fixed;"></div>

 

<script type="text/javascript"> 

 

    var num = new AW.Formats.Number;

    num.setTextFormat("#.###,");

    

    var currency = new AW.Formats.Number; 

    currency.setTextFormat(" ###.###,##");  

    

    var grid = new AW.UI.Grid;

    grid.setId("myGrid");

    grid.setHeaderText(myHeaders);

    grid.setVirtualMode(false);

    grid.setCellData(myData);

    grid.setCellFormat(num, 6);

    grid.setCellFormat(currency, 7);

    grid.setCellFormat(currency, 8);

    grid.setCellFormat(currency, 10);

    grid.setColumnCount(11);

    grid.setColumnWidth(200, 1); 

    grid.setSelectionMode("multi-row"); 

    grid.setRowCount(3);

    grid.setStyle("width", "99%");

    grid.setStyle("height", "500px");

    var link = new AW.Templates.Link;

    link.setAttribute("target", "_new");

    

    var myLinks = function(column, row){

    return "dynamics://0/?drilldown_0tableid=1967recid=" + myData[row][11] + "companyid=" + myData[row][12];

    }

 

    grid.setCellLink(myLinks);

    grid.setCellTemplate(new AW.Templates.Link, 0);

 

    grid.refresh();

</script>

</body>

</html>

Thanks for your help!

Forum search