How to calculate sum of to Summary column in sfDataGrid

i have two columns "Debit" and "Credit". i want to caluclate total sum of Debit and Credit in Footer also i need to show (TotalDebit-TotalCredit) in next Row in footer for the referance iam attaching photo


Attachment: Capture_55168b9f.zip

15 Replies

TP Tamilarasan Paranthaman Syncfusion Team March 8, 2022 01:48 PM UTC

Hi Shuhaib, 
As per the DataGrid structure, the footer is laid out before the table summary row. So, you can achieve your requirement by adding one more additional table summary row with the showSummaryInRow property as true which will act as dummy row. In the buildTableSummaryCellWidget method, get the credit and debit values using calculateSummaryValue method then subtract and set the respective row summary value. For that, we've created a sample. Please review the sample and code snippet below.  
 
Code Snippet: 
@override 
  Widget build(BuildContext context) { 
    return Scaffold( 
      appBar: AppBar( 
        title: const Text('DataGrid Table Summaries'), 
      ), 
      body: SfDataGrid( 
        source: _employeeDataSource, 
        columnWidthMode: ColumnWidthMode.fill, 
        columns: getColumns, 
        tableSummaryRows: [ 
          tableSummaryRow, 
          GridTableSummaryRow( 
              color: Colors.tealAccent, 
              showSummaryInRow: true, 
              columns: [], 
              position: GridTableSummaryRowPosition.bottom) 
        ], 
      ), 
    ); 
  } 
 
In DataGridSource: 
 
@override 
  Widget? buildTableSummaryCellWidget( 
      GridTableSummaryRow summaryRow, 
      GridSummaryColumn? summaryColumn, 
      RowColumnIndex rowColumnIndex, 
      String summaryValue) { 
    if (summaryColumn == null) { 
      summaryValue = 
          'Total balance: ${double.parse(calculateSummaryValue(tableSummaryRow, debitSummaryColumn, debitRowColumnIndex)) - double.parse(calculateSummaryValue(tableSummaryRow, creditSummaryColumn, creditRowColumnIndex))} for the Date'; 
    } 
    if (summaryColumn != null && summaryColumn.columnName == 'credit') { 
      creditRowColumnIndex = rowColumnIndex; 
    } else if (summaryColumn != null && summaryColumn.columnName == 'debit') { 
      debitRowColumnIndex = rowColumnIndex; 
    } 
    return Container( 
      padding: const EdgeInsets.all(15.0), 
      alignment: Alignment.center, 
      child: Text(summaryValue), 
    ); 
  } 
 
 
We hope this helps. Please let us know if need any further assistance.  
 
Regards, 
Tamilarasan 



BE beknazar July 21, 2022 07:36 AM UTC

i have int parse and its not work




BE beknazar July 21, 2022 07:37 AM UTC

  @override
  Widget? buildTableSummaryCellWidget(
      GridTableSummaryRow summaryRow,
      GridSummaryColumn? summaryColumn,
      RowColumnIndex rowColumnIndex,
      String summaryValue) {

            if (summaryColumn == null) {

      summaryValue =
          'Total balance: ${int.parse(calculateSummaryValue(tableSummaryRow, debitSummaryColumn, debitRowColumnIndex)) + int.parse(calculateSummaryValue(tableSummaryRow, creditSummaryColumn, creditRowColumnIndex) )} for the Date';
    }

        if (summaryColumn != null && summaryColumn.columnName == 'deviationSumm') {
      creditRowColumnIndex = rowColumnIndex;
    } else if (summaryColumn != null && summaryColumn.columnName == 'deviationItemPrice') {
      debitRowColumnIndex = rowColumnIndex;
    }

    return Container(
      padding: EdgeInsets.all(15.0),
      child:  Text(summaryValue),
    );
  }


BE beknazar July 21, 2022 07:57 AM UTC

help me 




TP Tamilarasan Paranthaman Syncfusion Team July 21, 2022 12:36 PM UTC

Hi Beknazar,


Based on the image you attached in this forum, we suspect that you have credit and debit properties as double. If it’s double, you get the summaryValue string in double format in the buildTableSummaryCellWidget i.e., string value format like "458600.0". So, you can't be able to convert the double string format directly into integer format. That’s why the exception occurred here. You can convert it to integer format once parsed into the double. Please check the following sample and code snippet.


  @override

  Widget? buildTableSummaryCellWidget(

      GridTableSummaryRow summaryRow,

      GridSummaryColumn? summaryColumn,

      RowColumnIndex rowColumnIndex,

      String summaryValue) {

    if (summaryColumn == null) {

 

      double debit = double.parse(calculateSummaryValue(

          tableSummaryRow, debitSummaryColumn, debitRowColumnIndex));

 

      double credit = double.parse(calculateSummaryValue(

          tableSummaryRow, creditSummaryColumn, creditRowColumnIndex));

 

      summaryValue =

          'Total balance: ${debit.toInt() - credit.toInt()} for the Date';

    }

    if (summaryColumn != null && summaryColumn.columnName == 'credit') {

      creditRowColumnIndex = rowColumnIndex;

    } else if (summaryColumn != null && summaryColumn.columnName == 'debit') {

      debitRowColumnIndex = rowColumnIndex;

    }

    return Container(

      padding: const EdgeInsets.all(15.0),

      alignment: Alignment.center,

      child: Text(summaryValue),

    );

  }

 

class Employee {

  Employee(this.id, this.name, this.designation, this.debit, this.credit);

  final int id;

  final String name;

  final String designation;

  final double debit;

  final double credit;

}


Sample Link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/sample1286343535




We hope this helps. Please let us know if you require any further assistance on this. We will be happy to assist you.


Regards,

Tamilarasan



BE beknazar October 25, 2022 09:56 AM UTC

what to do when there is decimal and int


BE beknazar October 25, 2022 09:59 AM UTC

how to do it right




BE beknazar October 26, 2022 03:20 AM UTC

help me 




BE beknazar October 26, 2022 05:46 AM UTC

@ Tamilarasan Paranthaman help me



BE beknazar October 26, 2022 05:49 AM UTC

class DataGridInventory {
  late String? name;
  late String? itemMeasurement;
  late int? arrivalQuantity;
  late Decimal? arrivalItemPrice;
  late Decimal? arrivalSum;
  late int? stockQuantity;
  late Decimal? stockItemPrice;
  late Decimal? stockSum;
  late int? deviationQuantity;
  late Decimal? deviationItemPrice;
  late Decimal? deviationSumm;
  final String? actId;



TP Tamilarasan Paranthaman Syncfusion Team October 26, 2022 12:02 PM UTC

Hi beknazar,


By default, SfDataGrid provides support for calculating the sum of column summary values for the num data types, i.e., int and double. If you are using the Decimal type apart from the num type, the empty value will be displayed. So, you need to convert the Decimal type to a double or int type for calculating the summary value when mapping the DataGridRow. Please check the following sample and code snippet,


class Employee {

  Employee(this.id, this.name, this.designation, this.debit, this.credit);

  final int id;

  final String name;

  final String designation;

  final Decimal debit;

  final Decimal credit;

}

 

List<Employee> getEmployeeData() {

  return [

    Employee(10001, 'James', 'Project Lead', Decimal.parse('5000.00'),

        Decimal.parse('2000.0')),

    Employee(10002, 'Kathryn', 'Manager', Decimal.parse('8000.00'),

        Decimal.parse('6000.0')),

    Employee(10003, 'Lara', 'Developer', Decimal.parse('10000.00'),

        Decimal.parse('5000.0')),

  ];

}

 

In buildDataGridRow method:

 

class EmployeeDataSource extends DataGridSource {

  EmployeeDataSource(

    List<Employee> employees,

    this.debitSummaryColumn,

    this.creditSummaryColumn,

    this.tableSummaryRow,

  ) {

    buildDataGridRow(employees);

  }

 

 

  void buildDataGridRow(List<Employee> employeeData) {

    dataGridRow = employeeData.map<DataGridRow>((employee) {

      return DataGridRow(cells: [

        DataGridCell<int>(columnName: 'id', value: employee.id),

        DataGridCell<String>(columnName: 'name', value: employee.name),

        DataGridCell<String>(

            columnName: 'designation', value: employee.designation),

        DataGridCell<double>(

            columnName: 'debit', value: employee.debit.toDouble()),

        DataGridCell<double>(

            columnName: 'credit', value: employee.credit.toDouble()),

      ]);

    }).toList();

  }

}


Sample Link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/main-957956191



We hope this helps. Please let us know if you need any further assistance with this.


Regards,

Tamilarasan



BE beknazar October 27, 2022 03:48 AM UTC

hi Tamilarasan. Thanks 



BE beknazar October 27, 2022 03:51 AM UTC

i have one question. help me pleas.


  void updateDataGridRows() {
    dataGridRow = _employees
        .map<DataGridRow>((dataGridRow) => DataGridRow(cells: [
              DataGridCell<String>(
                columnName: 'name',
                value: dataGridRow.name,
              ),


              DataGridCell<String>(
                columnName: 'itemMeasurement',
                value: dataGridRow.itemMeasurement,
              ),
              DataGridCell<double>(
                columnName: 'arrivalQuantity',
                value: dataGridRow.arrivalQuantity,
              ),
              DataGridCell<double>(
                columnName: 'arrivalItemPrice',
                value: dataGridRow.arrivalItemPrice,
              ),
              DataGridCell<double>(
                columnName: 'arrivalSum',
                value: dataGridRow.arrivalSum,
              ),
              DataGridCell<double>(
                columnName: 'stockQuantity',
                value: dataGridRow.stockQuantity,
              ),
              DataGridCell<double>(
                columnName: 'stockItemPrice',
                value: dataGridRow.stockItemPrice,
              ),
              DataGridCell<double>(
                columnName: 'stockSum',
                value: dataGridRow.stockSum,
              ),
              DataGridCell<double>(
                  columnName: 'deviationQuantity',
                  value: dataGridRow.deviationQuantity),
              DataGridCell<double>(
                  columnName: 'deviationItemPrice',
                  value: dataGridRow.deviationItemPrice),
              DataGridCell<double>(
                  columnName: 'deviationSumm',
                  value: dataGridRow.deviationSumm),
            ]))
        .toList();


how yo add here dropdown??



TP Tamilarasan Paranthaman Syncfusion Team October 27, 2022 01:05 PM UTC

Hi beknazar,


As per your requirement, you can achieve it in the DataGridSource.buildRow method. In the buildRow method, you can load the DropdownButton for the respective column. We have prepared a simple sample for that. In that sample, we have loaded the DropdownButton button for the city column. Please check the following sample and code snippet.


class EmployeeDataSource extends DataGridSource {

  EmployeeDataSource(this.employees) {

    buildDataGridRow(employees);

  }

 

 

 

  /// Building a [DropDown] for combo box column.

  Widget buildDropDownWidget(String? displayText,

      List<String> dropDownMenuItems, DataGridRow dataGridRow) {

    return Container(

      padding: const EdgeInsets.symmetric(horizontal: 16.0),

      alignment: Alignment.centerLeft,

      child: DropdownButton<String>(

          value: displayText,

          autofocus: true,

          focusColor: Colors.transparent,

          underline: const SizedBox.shrink(),

          icon: const Icon(Icons.arrow_drop_down_sharp),

          isExpanded: true,

          style: textStyle,

          onChanged: (String? value) {

            final int dataRowIndex = dataGridRows.indexOf(dataGridRow);

 

            if (value != null) {

              dataGridRows[dataRowIndex].getCells()[4] =

                  DataGridCell<String>(columnName: 'city', value: value);

              employees[dataRowIndex].city = value;

              notifyListeners();

            }

          },

          items:

              dropDownMenuItems.map<DropdownMenuItem<String>>((String value) {

            return DropdownMenuItem<String>(

              value: value,

              child: Text(value),

            );

          }).toList()),

    );

  }

 

  @override

  DataGridRowAdapter? buildRow(DataGridRow row) {

    return DataGridRowAdapter(

        cells: row.getCells().map<Widget>((dataGridCell) {

      return dataGridCell.columnName == 'city'

          ? buildDropDownWidget(dataGridCell.value, cities, row)

          : Container(

              alignment: Alignment.center,

              child: Text(

                dataGridCell.value.toString(),

              ));

    }).toList());

  }

}


Sample Link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/sample545048068


We hope this helps. Please let us know if you need any further assistance with this.


Regards,

Tamilarasan



BE beknazar October 28, 2022 08:09 AM UTC

thank you very much. Everything work


Loader.
Up arrow icon