2016-09-25 8 views
5

का उपयोग कर गतिशील ग्रिडव्यू के कई स्तंभों का कॉलम योग मेरे पास टेम्पलेट फील्ड टेक्स्टबॉक्स के रूप में सभी कॉलम के साथ एक गतिशील एएसपी ग्रिडव्यू है। ग्रिडव्यू के कॉलम भी गतिशील हैं और कॉलम गिनती हर बार भिन्न हो सकती है।जावास्क्रिप्ट

खोजने के कोड के नीचे

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; 
    } 
} 

और पंक्ति में कुल मैं keydown घटना पर एक जावास्क्रिप्ट समारोह और जोड़ा था पाने के लिए inorder कृपया इसकी स्पष्ट रूप से काम कर रहे

//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();   

    } 

और परिणाम enter image description here नीचे की तरह है

कोई भी कृपया प्रत्येक कॉलम (सभी समान सीएसएसक्लास) के योग को खोजने में मेरी सहायता कर सकता है। और इसे टी में प्रदर्शित करें वह Sizetotal पंक्ति क्योंकि मैं कॉलम

उत्तर

1

मैं प्रत्येक टेक्स्टबॉक्स को एक पंक्ति आईडी और कॉलम आईडी html5 data attributes के माध्यम से दूंगा। और जावास्क्रिप्ट (jQuery) में कॉलम आईडी के माध्यम से टेक्स्टबॉक्स फ़िल्टर करें।

उदाहरण:

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

वैसे, jQuery का उपयोग करें। यह आश्चर्यजनक है।

1

के माध्यम से लूप करने में सक्षम नहीं हूँ वहाँ एक बहुत ही सरल तरीका है।

प्रत्येक कॉलम में पाद लेख और लेबल जोड़ें, फिर डेटाबेस की तरफ से गणना करें LINQ का उपयोग करें और समूह द्वारा, प्रत्येक कॉलम के लिए पाद लेख लेबल नियंत्रण ढूंढें और उन पाद लेख लेबल नियंत्रण में बाइंड मानों को ढूंढें, इस प्रकार आपके यूआई में कम होगा भार।

कोड के लिए यहाँ देखें:

.aspx ग्रिड में पृष्ठ:

<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> 

सी # कोड:

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); 
      } 
+0

हाय श्याम लेकिन ग्रिडव्यू गतिशील है और फिर गणना तब होती है जब कॉलम में मान क्लाइंट –

+0

द्वारा बदल दिया जाता है, तो कृपया आप उस jquery उदाहरण को प्रदान कर सकते हैं –

1

आपकी आवश्यकता के बारे में सुनिश्चित नहीं हैं, लेकिन यह आपकी मदद कर सकता है , ग्रिड को डेटा बाध्य करने के बाद, कॉलम सूची

के माध्यम से एक बार फिर लूप करें
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"); 
} 
संबंधित मुद्दे