Suma kolumn z wieloma kolumnami dynamicznego gridviewu przy użyciu Javascriptu

Question

Mam dynamiczny asp Gridview ze wszystkimi kolumnami jako szablon tekstowy TextBox. Kolumny widoku Grid są również dynamiczne, a liczba kolumn może się zmieniać za każdym razem.

Proszę znaleźć kod poniżej

public void FillPoDetails() 
{ 
    DataTable dt = new DataTable();   
    dt = pmdata.createdatatable(int.Parse(Session["OurStyleid"].ToString()), int.Parse(Session["PoPackid"].ToString())); 
    GenerateTable(dt.Columns.Count, dt.Rows.Count,dt); 
    foreach (DataColumn col in dt.Columns) 
    { 
     //Declare the bound field and allocate memory for the bound field. 
     TemplateField bfield = new TemplateField(); 

     //Initalize the DataField value. 
     bfield.HeaderTemplate = new ArtWebApp.Controls.GridViewTemplate(ListItemType.Header, col.ColumnName); 

     //Initialize the HeaderText field value. 
     bfield.ItemTemplate = new ArtWebApp.Controls.GridViewTemplate(ListItemType.Item, col.ColumnName); 

     //Add the newly created bound field to the GridView. 
     GrdDynamic.Columns.Add(bfield); 
    } 
    GrdDynamic.DataSource = dt;  
    GrdDynamic.DataBind(); 
} 
public GridViewTemplate(ListItemType type, string colname) 
{ 
    //Stores the template type. 
    _templateType = type; 

    //Stores the column name. 
    _columnName = colname; 
} 

void ITemplate.InstantiateIn(System.Web.UI.Control container) 
{ 
    switch (_templateType) 
    { 
     case ListItemType.Header: 
      //Creates a new label control and add it to the container. 
      Label lbl = new Label();    
      //Allocates the new label object. 
      lbl.Text = _columnName; 
      lbl.CssClass = "Headerclass"; 
      //Assigns the name of the column in the lable. 
      container.Controls.Add(lbl);   
      //Adds the newly created label control to the container. 
      break; 
     case ListItemType.Item: 
      //Creates a new text box control and add it to the container. 
      TextBox tb1 = new TextBox();        
      //Allocates the new text box object. 
      tb1.DataBinding += new EventHandler(tb1_DataBinding);  
      //Attaches the data binding event. 
      tb1.Columns =6; 
      //Creates a column with size 4. 
      // tb1.Width = System.Web.UI.WebControls.Unit.Percentage(100); 
      tb1.Width = 100; 
      tb1.Wrap = true; 
      tb1.ID = "txt_" + _columnName; 
      if(_columnName== "ColorTotal") 
      { 
       tb1.CssClass = "ColorTotal"; 
      } 
      else if (_columnName == "Color") 
      { 
       tb1.CssClass = "Color"; 
      } 
      else 
      { 
       tb1.CssClass = "txtCalQty"; 
       tb1.Attributes.Add("onkeypress", "return isNumberKey(event,this)"); 
       tb1.Attributes.Add("onkeyup", "sumofQty(this)"); 
      }      
      container.Controls.Add(tb1);        
      //Adds the newly created textbox to the container. 
      break; 
    } 
} 

I Inorder się całkowitej rzędu miałem dodatkową funkcję JavaScript w keyDown i jego pracy wyraźnie

//calculate the sum of qty on keypress 
    function sumofQty(objText) { 


     var cell = objText.parentNode; 

     var row = cell.parentNode; 

     var sum = 0; 
     var textboxs = row.getElementsByClassName("txtCalQty"); 

     for (var i = 0; i < textboxs.length; i++) 
     { 
      sum += parseFloat(textboxs[i].value); 
     } 
     var textboxtotalqtys = row.getElementsByClassName("ColorTotal"); 
     textboxtotalqtys[0].value = sum.toString();   

    } 

a wynik jest jak poniżej

może ktoś mi pomóc w znalezieniu się sumę poszczególnych kolumn (wszystkie takie same CssClass) .i wyświetlić go w t Sizetotal on wiersz, ponieważ nie jestem w stanie pętli poprzez kolumn

Answer 1

Chciałbym nadać każdemu tekstowi identyfikator wiersza i identyfikator kolumny przez html5 data attributes. i JavaScript (jQuery) filtrowania otaczaniem przez kolumnę id.

przykład:

.. 
var sum = 0; 
$("input[data-column-id='" + selectedColumnId + "']").each(function(index) 
{ 
    sum += parseFloat($(this).val()); 
}); 
.. 

Nawiasem mówiąc, należy użyć jQuery. to niesamowite.

Answer 2

Jest bardzo prosty sposób.

Dodaj stopkę i etykietę do każdej kolumny, a następnie wykonaj obliczenia najlepiej od strony bazy danych, użyj LINQ i Grupuj według, znajdź stopkę Label Controls dla każdej kolumny i wartości Bind do kontroli etykiety Footer's, w ten sposób twój interfejs będzie mniejszy obciążenie.

Patrz tutaj dla kodu:

aspx w siatce:

<asp:TemplateField HeaderText="Total"> 
    <ItemTemplate> 
    <asp:Literal ID="ltrlTotal" Text='<%#Eval("Total") %>' runat="server"> </asp:Literal> // For Sub Total 
</ItemTemplate> 
<FooterTemplate> 
<strong><asp:Literal ID="ltrlGrandTotal" runat="server"> // This is Grand Total 
    </asp:Literal></strong> 
</FooterTemplate>      
</asp:TemplateField> 

C# Kod:

var searchResult = soService.SearchResult(companyId); 
      var grandTotal = searchResult.Select(so => so.Total).Sum(); 
      searchResult.All(aa => aa.GrandTotal == grandTotal); 

      gridSo.DataSource = searchResult; 
      gridSo.DataBind(); 

      if (searchResult.Count > 0) 
      { 
       Literal ltrlGrandTotal = gridSo.FooterRow.FindControl("ltrlGrandTotal") as Literal; 
       if (ltrlGrandTotal != null) 
        ltrlGrandTotal.Text = string.Format("Grand Total : $ {0}", grandTotal); 
      } 

Answer 3

Nie wiesz o swoim obowiązku, ale może to pomóc , Po związaniu danych sieci, ponownie pętli listę kolumnowej

GrdDynamic.DataSource = dt;  
GrdDynamic.DataBind(); 
int rowIndex=2; 
GrdDynamic.FooterRow.Cells[1].Text = "Total"; 
GrdDynamic.FooterRow.Cells[1].HorizontalAlign = HorizontalAlign.Right; 
foreach (DataColumn col in dt.Columns) 
{ 
    decimal total = dt.AsEnumerable().Sum(row => row.Field<decimal>(col.Caption)); 
    GrdDynamic.FooterRow.Cells[rowIndex++].Text = total.ToString("N2"); 
}