creating a "total" column in datagrid flex
Here is what I want to do: I want to have a datagrid that displays a total value for each row. Lets say for example I have a datagrid. In this datagrid on each row I have five columns. Of the five columns four are for the user to input numbers. The开发者_运维知识库 fifth column is the the "total" column which is the result of a formula that calculates the previous four columns on that row in which the user inputs the numbers.
example:
Row 1: (1st COLUMN)200 + (2nd COLUMN)300 - (3rd COLUMN)100 + (4TH COLUMN)90 = (TOTAL COLUMN)490
Row 2: (1st COLUMN)400 + (2nd COLUMN)300 - (3rd COLUMN)50 + (4TH COLUMN)90 = (TOTAL COLUMN)740
ROW 3: etc...
Ive been working on this for hours does anyone have any suggestions on how to do that?
Any help is greatly appreciated!
Use labelFunction
<mx:DataGrid id="dg" width="100%" height="100%" rowCount="5" dataProvider="{employees}">
<mx:columns>
<mx:DataGridColumn dataField="d1" headerText="Data 1"/>
<mx:DataGridColumn dataField="d2" headerText="Data 2"/>
<mx:DataGridColumn dataField="d3" headerText="Data 3"/>
<mx:DataGridColumn labelFunction="getTotal" headerText="Total" />
</mx:columns>
</mx:DataGrid>
Script:
public function getTotal(item:Object, column:DataGridColumn):String
{
var sum:Number = item.d1 + item.d2 + item.d3;
return sum.toString();
}
Although it seems to be too late for a new comment, I have to add that:
If you want to update the total column every time the user change a value of the other columns, you have to add: new Number
, before its one of the values.
var sum:Number = new Number(item.d1) + new Number(item.d2) + new Number(item.d3);
Add a total value to the objects you are passing in array as dataprovider. Compute the total before displaying them by looping trough all elements.
You could write a labelFunction and do the calculation there, so you don't need to change your dataProvider.
<mx:DataGridColumn headerText="total"
labelFunction="{myLabelFunc}"/>
and the function:
public static function myLabelFunc(item:Object, column:DataGridColumn):String {
// do your calculation
return result;
}
精彩评论