Add new row and show total of DataGrid Rows and Columns Flex

After a lot of search in this particular problem of the how to add the column values present in datagrid and also adding dynamic rows to data grid and the entries in data Grid must be reflected in Summation of Columns. I am trying to provide a workaround code which fulfills all these requirements. This is a very simple code and shows the details.

Here is the Sample.mxml file

<![CDATA[
import mx.controls.dataGridClasses.DataGridColumn;
import com.adobe.viewsource.ViewSource;
import mx.controls.TextInput;
import mx.binding.utils.BindingUtils;
import mx.events.DataGridEvent;
import mx.formatters.DateFormatter;
import mx.formatters.Formatter;
import flash.utils.getTimer;
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.events.CalendarLayoutChangeEvent;
import mx.core.IUIComponent;
import mx.events.DragEvent;
import mx.managers.DragManager;
import mx.events.CollectionEvent;
[Bindable]
private var arrColl:ArrayCollection=new ArrayCollection([{SNo:'Total',Value1:'',Value2:''}]);
[Bindable]
private var tasks:ArrayCollection;
[Bindable]
public var intTotal1:int=new int();
[Bindable]
public var intTotal2:int=new int();
[Bindable]
public var intTotal3:int=new int();
[Bindable]
public var myTotalArr:ArrayCollection=new ArrayCollection();
private static const ADD_TASK:String = "Add Task";
private function init():void
{
var srcUrl:String = Application.application.parameters.srcUrl;
if(srcUrl)
{
ViewSource.addMenuItem(this, srcUrl);
}
tasks = new ArrayCollection();
tasks.addItem(new Task(1, 10, 20));
tasks.addItem(new Task(2, 20, 20));
tasks.addItem({title: ADD_TASK});
for (var i:int=0;i<tasks.length -1;i++)
{
intTotal1=tasks[i].Value1+intTotal1;
}
for (var j:int=0;j<tasks.length -1;j++)
{
intTotal2=tasks[j].Value2+intTotal2;
}
for (var k:int=0;k<tasks.length -1;k++)
{
myTotalArr.addItem(tasks[k].Value1+tasks[k].Value2);
}
for (var a:int=0;a<myTotalArr.length;a++)
{
intTotal3=myTotalArr[a]+intTotal3;
}
}
private function sum_labelFunc(item:Object, col:DataGridColumn):Number
{

return Number(item.Value1) + Number(item.Value2) ;
}
private function checkEdit(e:DataGridEvent):void
{
// Do not allow editing of Add Task row except for
// "Click to Add" column
if(e.rowIndex == tasks.length - 1 && e.columnIndex != 0)
e.preventDefault();
}

private function editEnd(e:DataGridEvent):void
{
if(e.columnIndex==0)
{
var txtIn0:TextInput = TextInput(e.currentTarget.itemEditorInstance);
// Adding a new task
if(e.rowIndex == tasks.length - 1)
{
var dt0:Object = e.itemRenderer.data;
// Add new task
if(txtIn0.text != ADD_TASK)
{
tasks.addItemAt(new Task(Number(txtIn0.text),0,0), e.rowIndex);
}
// Destroy item editor
abc.destroyItemEditor();
// Stop default behavior
e.preventDefault();
}
}
else if(e.columnIndex==1)
{
var txtIn1:TextInput = TextInput(e.currentTarget.itemEditorInstance);
// Adding a new task
if(e.rowIndex == tasks.length - 1)
{
var dt1:Object = e.itemRenderer.data;
// Add new task
if(txtIn1.text != ADD_TASK)
{
tasks.addItemAt(new Task(Number(txtIn1.text),0,0), e.rowIndex);
}
// Destroy item editor
abc.destroyItemEditor();
// Stop default behavior
e.preventDefault();
}
var diff1:int = int(txtIn1.text) - int(abc.dataProvider[e.rowIndex].Value1) ;
intTotal1=intTotal1+diff1;
for (var k:int=1;k<myTotalArr.length;k++)
{
intTotal3=intTotal3+diff1;
}
}
else if (e.columnIndex==2)
{
var txtIn2:TextInput = TextInput(e.currentTarget.itemEditorInstance);
// Adding a new task
if(e.rowIndex == tasks.length - 1)
{
var dt2:Object = e.itemRenderer.data;
// Add new task
if(txtIn2.text != ADD_TASK)
{
tasks.addItemAt(new Task(Number(txtIn2.text),0,0), e.rowIndex);
}
// Destroy item editor
abc.destroyItemEditor();
// Stop default behavior
e.preventDefault();
}
var diff2:int = int(txtIn2.text) - int(abc.dataProvider[e.rowIndex].Value2) ;
intTotal2=intTotal2+diff2;
for (var k:int=1;k

<!--
-->

Also task.as file which is used to add the rows.


package
{
[Bindable]
public class Task
{
public function Task(SNo:int, Value1:int, Value2:int)
{
this.SNo = SNo;
this.Value1 = Value1;
this.Value2 = Value2;
}

public var SNo:int;
public var Value1:int;
public var Value2:int;
}
}

I think this will be helpful. Also i want to provide the links which will be helpful in this regards.
http://blogs.adobe.com/aharui/2007/04/datagrid_footers.html

Umal Kumar Bhole

3 thoughts on “Add new row and show total of DataGrid Rows and Columns Flex

  1. I needed to thank you for this fantastic read!
    ! I definitely enjoyed every little bit of it.
    I have you bookmarked to look at new things you
    post…

Leave a comment