This is a migrated thread and some comments may be shown as answers.

Rad Grid Batch Edit Mode Finding the sum of all the cells when auto generated columns true

1 Answer 149 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Chakravarthy
Top achievements
Rank 1
Chakravarthy asked on 08 Jun 2015, 05:51 AM

Hi,

We have a radgrid.We have a requirement like entering the time and finding the sum of all the cells and display into the last column  of the grid when columns are generating dynamically.

We have tried with client side event on row selected event but sum is not coming when moving from one cell to second cell.

Below i am giving the scenarios how we have used the client events please reply to this thread as early as possible.

 



 

1.       We are
able to fetch the selected cell value but unable to fetch the remaining
corresponding cell values. You can find the same in the sample project
(BatchEdit.aspx – OnBatchEditCellValueChanged event)
source code:
 <html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
      <script type="text/javascript">
          function BatchEditCellValueChanged(sender, args) {


              var grid = sender;

              var row = args.get_row();
              var cell = args.get_cell();
              var tableView = args.get_tableView();
              var column = args.get_column();
              var columnUniqueName = args.get_columnUniqueName();
              var editorValue = args.get_editorValue();
              var cellValue = args.get_cellValue();
              alert(editorValue);

              var columnlength = grid.get_masterTableView().get_columns().length;
              for (i = 0 ; i < columnlength; i++) {
                  cell = grid.get_masterTableView().get_columns()[i].get_uniqueName();
                  alert(cell);
              }

          }
    </script>

</head>
<body>
    <form id="form1" runat="server">
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>
       <div>
     <telerik:RadGrid ID="RadGrid1" runat="server">
        <MasterTableView EditMode="Batch" BatchEditingSettings-EditType="Cell">
        </MasterTableView>
        <ClientSettings>
            <Selecting AllowRowSelect="True" CellSelectionMode="MultiCell" />
            <ClientEvents OnBatchEditCellValueChanged="BatchEditCellValueChanged" />
        </ClientSettings>
    </telerik:RadGrid>
    </div>
    </form>
</body>
</html>

 code Behind:
public partial class BatchEdit : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        GetValues();
    }
    private void GetValues()
    {
        DataTable dtTable = new DataTable();
        dtTable.Columns.Add("Sum");
        dtTable.Columns.Add("Value1"); dtTable.Columns.Add("Value2");
        dtTable.Columns.Add("Value3"); dtTable.Columns.Add("Value4");

        DataRow dr = dtTable.NewRow();
        dr["Sum"] = "";
        dr["Value1"] = "1"; dr["Value2"] = "2";
        dr["Value3"] = "3"; dr["Value4"] = "4";
        dtTable.Rows.Add(dr);

        DataRow drr = dtTable.NewRow();
        drr["Sum"] = "";
        drr["Value1"] = "5"; drr["Value2"] = "6";
        drr["Value3"] = "7"; drr["Value4"] = "8";
        dtTable.Rows.Add(drr);


        RadGrid1.DataSource = dtTable;
        RadGrid1.DataBind();

    }
}
2.       We are
able to fetch the selected cell value and corresponding cell values in the same
row by hardcoding the column names, but dynamically we are unable to get the
values of the cell. You can find the same in the sample project
(OnRowSelected.aspx – OnRowSelected event)
source code:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="OnRowSelected.aspx.cs" Inherits="OnRowSelected" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>

  <script type="text/javascript">
      function RowSelected(sender, eventArgs) {
          var grid = sender;
          var MasterTable = grid.get_masterTableView();
         
          var row = MasterTable.get_dataItems()[eventArgs.get_itemIndexHierarchical()];
          var cell1 = MasterTable.getCellByColumnUniqueName(row, "Value1");
          var cell2 = MasterTable.getCellByColumnUniqueName(row, "Value2");
          var cell3 = MasterTable.getCellByColumnUniqueName(row, "Value3");
          var cell4 = MasterTable.getCellByColumnUniqueName(row, "Value4");
          var total = 0;
          var arr = [];
          var total = 0;
      
          var columnlength = grid.get_masterTableView().get_columns().length;
          for (i = 0 ; i < columnlength; i++) {
              cell = grid.get_masterTableView().get_columns()[i].get_uniqueName();
           
              var cell = MasterTable.getCellByColumnUniqueName(row, cell);
              var val = parseInt(cell.innerText);
              arr[i] = val;
             

          }
          for (i = 1; i < arr.length; i++) {

              total += arr[i];
          }

          var cell1 = MasterTable.getCellByColumnUniqueName(row, "Sum");
          cell1.innerText = total;
          cell1.eventArgs.set_cancel(true);


      }
    </script>
   <%-- var grid = $find("<%=RadGrid1.ClientID%>");
    var tableView = sender.get_masterTableView();
    var batchManager = sender.get_batchEditingManager();
    var items = tableView.get_dataItems();
    var mapValues = [];
    for (var i = 0; i < items.length; i++) {
        var mapCell = items[i].get_cell("Map");
        var mapValue = batchManager.getCellValue(mapCell);
        mapValues.push(mapValue);
    }--%>
</head>
<body>
    <form id="form1" runat="server">
         <telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>
         <asp:HiddenField ID="HiddenField1" runat="server" />
    <div>
    <telerik:RadGrid ID="RadGrid1" runat="server">
        <MasterTableView EditMode="Batch" BatchEditingSettings-EditType="Cell" >
        </MasterTableView>
        <ClientSettings>
            <Selecting AllowRowSelect="True" CellSelectionMode="MultiCell" />
            <ClientEvents OnRowClick="RowSelected" />
        </ClientSettings>
    </telerik:RadGrid>
    </div>
    </form>
</body>
</html>

code behind:

using System;
using System.Collections.Generic;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class OnRowSelected : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        GetValues();
    }
    private void GetValues()
    {
        DataTable dtTable = new DataTable();
        dtTable.Columns.Add("Sum");
        dtTable.Columns.Add("Value1"); dtTable.Columns.Add("Value2");
        dtTable.Columns.Add("Value3"); dtTable.Columns.Add("Value4");

        DataRow dr = dtTable.NewRow();
        dr["Sum"] = "";
        dr["Value1"] = "1"; dr["Value2"] = "2";
        dr["Value3"] = "3"; dr["Value4"] = "4";
        dtTable.Rows.Add(dr);

        DataRow drr = dtTable.NewRow();
        drr["Sum"] = "";
        drr["Value1"] = "5"; drr["Value2"] = "6";
        drr["Value3"] = "7"; drr["Value4"] = "8";
        dtTable.Rows.Add(drr);


        RadGrid1.DataSource = dtTable;
        RadGrid1.DataBind();

    }
}
 

1 Answer, 1 is accepted

Sort by
0
Angel Petrov
Telerik team
answered on 10 Jun 2015, 11:27 AM
Hello,

I have already provided an answer regarding this query in the official support ticket you have opened. In order to help other community members overwhelm such types of problems I am pasting the response from the official ticket here.

"In order to make things as generic as possible you can traverse the cells of the row inside the OnBatchEditClosed handler and obtain their value using the getCellValue method. After the sum is calculated you can change the sum cell value by calling the changeCellValue method. A possible realization of this scenario is available in the following code snippet."

ASPX:
<head id="Head1" runat="server">
     <title></title>
       <script type="text/javascript">
           function batchEditClosed(sender, args) {
               setTimeout(function myfunction() {
                   var grid = sender;
                   var row = args.get_row();
                   var sum = 0;
                   var columnlength = grid.get_masterTableView().get_columns().length;
                   for (i = 0 ; i < row.cells.length; i++) {
                       if (i !== 0) {
                           sum += parseFloat(grid.get_batchEditingManager().getCellValue(row.cells[i]));
                       }
                   }
                   grid.get_batchEditingManager().changeCellValue(row.cells[0], sum);
               }, 100);
           }
  
     </script>
   
</head>
 <body>
     <form id="form1" runat="server">
         <telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>
        <div>
      <telerik:RadGrid ID="RadGrid1" runat="server">
         <MasterTableView EditMode="Batch" BatchEditingSettings-EditType="Cell">
         </MasterTableView>
         <ClientSettings>
             <Selecting AllowRowSelect="True" CellSelectionMode="MultiCell" />
             <ClientEvents OnBatchEditClosed="batchEditClosed" />
         </ClientSettings>
     </telerik:RadGrid>
     </div>
     </form>
 </body>
 </html>

"Information about the used batch editing manager client-side methods can be found here."

Regards,
Angel Petrov
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Tags
Grid
Asked by
Chakravarthy
Top achievements
Rank 1
Answers by
Angel Petrov
Telerik team
Share this question
or