Unable to format footer like Data cells

Hi

I using the xml model for grid redering.
I have table in which I show data(sum) on the footer which I need to be formatted with Number format(#,###.) .I have tried to apply the AW.Formats.Number but that is not working..

Please any one help me out to resolve the matter.

The code base for sample is :

<html>
<head>
<title>ActiveWidgets Grid :: Edit And Sort</title>
<style> body, html {margin:0px; padding: 0px; overflow: hidden;} </style>


<link href="runtime/styles/xp/aw.css" rel="stylesheet" type="text/css" ></link>
<script src="runtime/lib/aw.js"></script>


<style>
.aw-grid-control {height: 100%; width: 100%; margin: 0px; border: none; font: menu;}
.aw-row-selector {text-align: center}

.aw-column-0 {width: 80px;}
.aw-column-1 {width: 200px;}
.aw-column-2 {text-align: right;}
.aw-column-3 {text-align: right;}
.aw-column-4 {text-align: right;}

.aw-grid-cell {border-right: 1px solid threedlightshadow;}
.aw-grid-row {border-bottom: 1px solid threedlightshadow;}
.aw-grid-footers .aw-grid-footer {
border-right: 1px solid threedshadow;height:20px;text-align:right;
}
</style>


<script>

var myColumns = [
"Ticker", "Company Name", "Market Cap.", "$ Sales", "Employees"
];
var footer = [
"10000", "2300000", "29000000", "8900000", "230977"
];

</script>
</head>
<body>
<script>

// create ActiveWidgets data model - XML-based table
var table = new AW.XML.Table;

// provide data URL
table.setURL("companies-simple.xml");

// start asyncronous data retrieval
table.request();

table.setData = function(value, col, row){
//alert("here");
var node = this.getNode(col, row);
if (AW.ie) {
node.text = value;
}
else {
node.textContent = value;
}
}

// create ActiveWidgets Grid javascript object
var obj = new AW.UI.Grid;

// define data formats
var str = new AW.Formats.String;
var num = new AW.Formats.Number;
//num.setTextFormat("#,###.");
var floatFormat = new AW.Formats.Number;
floatFormat.setTextFormat("#,###.###");
obj.setCellFormat([str, str, floatFormat, floatFormat,num]);

// provide cells and headers text
//obj.setCellText(myData);
obj.setHeaderText(myColumns);

// set number of rows/columns
obj.setRowCount(20);
obj.setColumnCount(5);

// enable row selectors
obj.setSelectorVisible(true);
obj.setSelectorText(function(i){return this.getRowPosition(i)+1});

// set headers width/height
obj.setSelectorWidth(28);
obj.setHeaderHeight(20);

// set row selection
obj.setSelectionMode("single-cell");

obj.setCellEditable(true);

// set click action handler
obj.onCellClicked = function(event, col, row){window.status = this.getCellText(col, row)};

// assign external 'data model'
obj.setCellModel(table);
obj.setFooterVisible(true);
obj.setFooterCount(1);
obj.setFooterText(footer);
obj.setFooterValue(footer);
obj.getFooterTemplate().setStyle("background-color","Menu");
obj.setFooterFormat(num,4);
obj.setFooterFormat([str, str, floatFormat, floatFormat,num]);
// write grid html to the page
document.write(obj);

</script>
</body>
</html>

Thanks
Vikramaditya Garg

Vikramaditya Garg

August 20,

Currently dataToText conversion is missing in header and footer models. You should add footer text function which converts footer data using footer format -

obj.setFooterVisible(true);
obj.setFooterData(footer);
obj.setFooterFormat([str, str, floatFormat, floatFormat,num]);
obj.setFooterText(function(col, row){
    var format = this.getFooterFormat(col, row);
    var data = this.getFooterData(col, row);
    return format ? format.dataToText(data) : data;
});

Alex (ActiveWidgets)

August 21,

Its works now.Cheers ! Alex

Vikramaditya Garg

August 22,

This topic is archived.

Unable to format footer like Data cells

See also:

Search

New Data Grid

Version 2