show total and grand total without postback

Question

Hello

This Is my sql data

  SET ANSI_NULLS ON GO SET QUOTED_IDENTIFIER ON GO SET ANSI_PADDING ON GO CREATE TABLE [dbo].[Table_1]( 	[ID] [int] IDENTITY(1,1) NOT NULL, 	[Field1] [varchar](50) NULL, 	[Field2] [varchar](50) NULL, 	[Field3] [varchar](50) NULL, 	[Field4] [float] NULL,  CONSTRAINT [PK_Table_1] PRIMARY KEY CLUSTERED  ( 	[ID] ASC )WITH (PAD_INDEX  = OFF, STATISTICS_NORECOMPUTE  = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS  = ON, ALLOW_PAGE_LOCKS  = ON) ON [PRIMARY] ) ON [PRIMARY] GO SET ANSI_PADDING OFF GO SET IDENTITY_INSERT [dbo].[Table_1] ON INSERT [dbo].[Table_1] ([ID], [Field1], [Field2], [Field3], [Field4]) VALUES (1, N'Apple', N'AA', N'BB', 100) INSERT [dbo].[Table_1] ([ID], [Field1], [Field2], [Field3], [Field4]) VALUES (2, N'Mango', N'AA', N'CC', 200) INSERT [dbo].[Table_1] ([ID], [Field1], [Field2], [Field3], [Field4]) VALUES (3, N'Orange', N'CC', N'DD', 50) INSERT [dbo].[Table_1] ([ID], [Field1], [Field2], [Field3], [Field4]) VALUES (4, N'Apple', N'CC', N'KK', 100) INSERT [dbo].[Table_1] ([ID], [Field1], [Field2], [Field3], [Field4]) VALUES (5, N'Mango', N'JJ', N'UP', 10) INSERT [dbo].[Table_1] ([ID], [Field1], [Field2], [Field3], [Field4]) VALUES (6, N'Mango', N'GG', N'EE', 90) SET IDENTITY_INSERT [dbo].[Table_1] OFF

This is my aspx page

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
 


    Untitled Page
  



    
 


    
    
        FROM DATE
        25-NOV-2023
        TO DATE
        30-NOV-2023 

    
    
      
  
  
 
  Field1
  Field2
 
   
 
  
  
    
   
    
  
 
                         
    
    
      
            
          
        
        
          
          
           Field1
           Field2
             Field3
            Field4           
            
                           
                           
          
        
        
         
         
             
            <%#Eval("Field1")%>            
            <%#Eval("Field2")%>
             <%#Eval("Field3")%>
             <%#Eval("Field4")%>

This is my aspx code behind page

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;
using System.IO;
using System.Collections.Generic;
using System.Data;
using System.Data.SqlClient;
using System.Web.Services;
using System.Text;

public partial class _Default : System.Web.UI.Page
{

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            //Table_1
            DataTable dt = new DataTable();
            SqlConnection con1 = new SqlConnection(ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString);
            con1.Open();
            SqlCommand cmd1 = new SqlCommand("select * from Table_1 order by Field1 asc", con1);
            SqlDataAdapter ada1 = new SqlDataAdapter(cmd1);
            ada1.Fill(dt);
            Repeater1.DataSource = dt;
            Repeater1.DataBind();
            con1.Close();
            con1.Dispose();
        } 
    }

    
   
    
 
   
   
}

This is my output

I need two things from above code

I want output like this as below using my above code

User's image

2)If I Do Field2 Filter For Example AA Select Then It Has To Show Like this Below
mnb

How to do using my code
Thanking You

Accepted Answer

Hi @RAVI,

You can add a footer and then use the footerCallback function to handle the totaling logic. In the drawCallbackfunction, subtotal is calculated and then drawn.

footerCallback

footerCallback: function (tfoot, data, start, end, display) {
                    let api = this.api();
                    api.column(2).footer().innerHTML = "Grand total";
                    // Total over all pages
                    total = api
                        .column(3, { search: 'applied' })
                        .data()
                        .reduce((a, b) => intVal(a) + intVal(b), 0);

                    // Update footer

                    api.column(3).footer().innerHTML = total;
                },

drawCallback

 "drawCallback": function (settings) {
                    var api = this.api(), data;
                    var rows = api.rows({ page: 'current' }).nodes();                
                    if (sessionStorage.getItem("rowCount") == rows.length) {
                        var last = null;
                        total = new Array();
                        api.column(0, { page: 'current' }).data().each(function (group, i) {
                            group_assoc = group.replace(' ', "_");
                            if (typeof total[group_assoc] != 'undefined') {
                                total[group_assoc] = total[group_assoc] + intVal(api.column(3).data()[i]);
                            } else {
                                total[group_assoc] = intVal(api.column(3).data()[i]);
                            }
                            if (last !== group) {
                                $(rows).eq(i).before(
                                    '' + "Totol(" + group + ")" + ''
                                );

                                last = group;
                            }
                        });
                        for (var key in total) {
                            $("." + key).html(total[key]);
                        }
                    }
                },

All code



    Untitled Page
    
    
    


    


    
        
            FROM DATE
        25-NOV-2023
            TO DATE
        30-NOV-2023 

            
                
                    Field1
                    Field2
                
                
                    
                    
                
            
            
                
                    
                                
                                    
                        
                            
                                Field1
                                Field2
                                Field3
                                Field4
                            
                        
                        
                            
                                        <%#Eval("Field1")%>
                                        <%#Eval("Field2")%>
                                        <%#Eval("Field3")%>
                                        <%#Eval("Field4")%>

Best regards,
Lan Huang

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

show total and grand total without postback

0 additional answers