DxGridSummaryItem.FooterColumnName Property

Specifies a column under which to display the summary value.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v21.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[Parameter]
public string FooterColumnName { get; set; }

Property Value

Type	Description
String	The column name.

Remarks

The DxGrid supports total and group summaries. Each summary can contain predefined and custom summary items.

Total Summary

The Grid displays the total summary value under the column bound to the specified data field (FieldName). To show the summary value under another column, assign the column name to the FooterColumnName property.

Run Demo: Grid - Total Summary

Razor

@using Microsoft.EntityFrameworkCore
@using Grid.Northwind
@inject NorthwindContext Northwind

<DxGrid Data="GridDataSource"
        UnboundColumnData="Grid_CustomUnboundColumnData">
    <Columns>
        <DxGridDataColumn FieldName="ProductId" DisplayFormat="d" />
        <DxGridDataColumn FieldName="UnitPrice" />
        <DxGridDataColumn FieldName="Quantity" />
        <DxGridDataColumn FieldName="Discount" DisplayFormat="p0" />
        <DxGridDataColumn FieldName="TotalPrice"
                      DisplayFormat="c"
                      UnboundType="GridUnboundColumnType.Decimal" />
    </Columns>
    <TotalSummary>
        <DxGridSummaryItem SummaryType="GridSummaryItemType.Sum" FieldName="TotalPrice" />
        <DxGridSummaryItem SummaryType="GridSummaryItemType.Max"
                           FieldName="UnitPrice"
                           ValueDisplayFormat="c"                           
                           FooterColumnName="TotalPrice" />
    </TotalSummary>
</DxGrid>
@* ... *@
@code {
    object GridDataSource { get; set; }
    int totalCount;

    protected override void OnInitialized() {
        GridDataSource = Northwind.OrderDetails
            .Include(i => i.Order)
            .Include(i => i.Product)
            .ToList();
    }
    @* ... *@
    void Grid_CustomUnboundColumnData(GridUnboundColumnDataEventArgs e) {
        if (e.FieldName == "TotalPrice") {
            var UnitPrice = Convert.ToDecimal(e.GetRowValue("UnitPrice"));
            var Quantity = Convert.ToDecimal(e.GetRowValue("Quantity"));
            var Discount = Convert.ToDecimal(e.GetRowValue("Discount"));
            e.Value = Quantity * UnitPrice * (1 - Discount);
        }
    }
    @* ... *@
}

OrderDetail

using System;
using System.Collections.Generic;

#nullable disable

namespace Grid.Northwind {
    public partial class OrderDetail {
        public int OrderId { get; set; }
        public int ProductId { get; set; }
        public decimal UnitPrice { get; set; }
        public short Quantity { get; set; }
        public float Discount { get; set; }

        public virtual Order Order { get; set; }
        public virtual Product Product { get; set; }
    }
}

NorthwindContext.cs

using Microsoft.EntityFrameworkCore;
#nullable disable

namespace Grid.Northwind {
    public partial class NorthwindContext : DbContext {
        public NorthwindContext() {
        }

        public NorthwindContext(DbContextOptions<NorthwindContext> options)
            : base(options) {
        }
        // ...
        public virtual DbSet<OrderDetail> OrderDetails { get; set; }
        // ...
        protected override void OnConfiguring(DbContextOptionsBuilder optionsBuilder) {
            if(!optionsBuilder.IsConfigured) {
                optionsBuilder.UseSqlServer("Server=.\\sqlexpress;Database=Northwind;Integrated Security=true");
            }
        }
        // ...
        protected override void OnModelCreating(ModelBuilder modelBuilder) {
        // ...
            modelBuilder.Entity<OrderDetail>(entity => {
                entity.HasKey(e => new { e.OrderId, e.ProductId })
                    .HasName("PK_Order_Details");
                entity.ToTable("Order Details");
                entity.HasIndex(e => e.OrderId, "OrderID");
                entity.HasIndex(e => e.OrderId, "OrdersOrder_Details");
                entity.HasIndex(e => e.ProductId, "ProductID");
                entity.HasIndex(e => e.ProductId, "ProductsOrder_Details");
                entity.Property(e => e.OrderId).HasColumnName("OrderID");
                entity.Property(e => e.ProductId).HasColumnName("ProductID");
                entity.Property(e => e.Quantity).HasDefaultValueSql("((1))");
                entity.Property(e => e.UnitPrice).HasColumnType("money");
                entity.HasOne(d => d.Order)
                    .WithMany(p => p.OrderDetails)
                    .HasForeignKey(d => d.OrderId)
                    .OnDelete(DeleteBehavior.ClientSetNull)
                    .HasConstraintName("FK_Order_Details_Orders");
                entity.HasOne(d => d.Product)
                    .WithMany(p => p.OrderDetails)
                    .HasForeignKey(d => d.ProductId)
                    .OnDelete(DeleteBehavior.ClientSetNull)
                    .HasConstraintName("FK_Order_Details_Products");
            });
            // ...
            OnModelCreatingPartial(modelBuilder);
        }
        // ...
    }
}

Startup.cs

public class Startup {
// ...
    public void ConfigureServices(IServiceCollection services) {
    // ...
        services.AddEntityFrameworkSqlServer();
        services.AddDbContext<NorthwindContext>((sp, options) => {
            var env = sp.GetRequiredService<IWebHostEnvironment>();
            var dbPath = Path.Combine(env.ContentRootPath, "Northwind-5e44b51f.mdf");
            options.UseSqlServer("Server=(localdb)\\MSSQLLocalDB;Integrated Security=true;AttachDbFileName=" + dbPath);
        });
    }
    // ...
}

Group Summary

The Grid displays the group summary value in the group row after the group header. To show the summary value in the group footer, set the FooterColumnName property to the target column’s name.

Run Demo: Grid - Group Footer Summary

Razor

@using Grid.Northwind
@inject NorthwindContext Northwind

<DxGrid Data="@Data"
        ShowGroupPanel="true"
        UnboundColumnData="Grid_CustomUnboundColumnData">
    <Columns>
        <DxGridDataColumn FieldName="Country" />
        <DxGridDataColumn FieldName="City" />
        <DxGridDataColumn FieldName="OrderDate" GroupIndex="0" />
        <DxGridDataColumn FieldName="UnitPrice" DisplayFormat="c" />
        <DxGridDataColumn FieldName="Quantity" />
        <DxGridDataColumn FieldName="TotalPrice"
                          DisplayFormat="c"
                          UnboundType="GridUnboundColumnType.Decimal" />
    </Columns>
    <GroupSummary>
        <DxGridSummaryItem SummaryType="GridSummaryItemType.Count" FieldName="Country" />
        <DxGridSummaryItem SummaryType="GridSummaryItemType.Sum" FieldName="TotalPrice"
                           FooterColumnName="TotalPrice"/>
    </GroupSummary>
</DxGrid>
@* ... *@
@code {
    object Data { get; set; }

    protected override void OnInitialized() {
        Data = Northwind.Invoices
            .ToList();
    }

    void Grid_CustomUnboundColumnData(GridUnboundColumnDataEventArgs e) {
        if (e.FieldName == "TotalPrice") {
            var UnitPrice = Convert.ToDecimal(e.GetRowValue("UnitPrice"));
            var Quantity = Convert.ToDecimal(e.GetRowValue("Quantity"));
            var Discount = Convert.ToDecimal(e.GetRowValue("Discount"));
            e.Value = Quantity * UnitPrice * (1 - Discount);
        }
    }
}

Invoice

using System;
#nullable disable

namespace Grid.Northwind {
    public partial class Invoice {
        public string ShipName { get; set; }
        public string ShipAddress { get; set; }
        public string ShipCity { get; set; }
        public string ShipRegion { get; set; }
        public string ShipPostalCode { get; set; }
        public string ShipCountry { get; set; }
        public string CustomerId { get; set; }
        public string CustomerName { get; set; }
        public string Address { get; set; }
        public string City { get; set; }
        public string Region { get; set; }
        public string PostalCode { get; set; }
        public string Country { get; set; }
        public string Salesperson { get; set; }
        public int OrderId { get; set; }
        public DateTime? OrderDate { get; set; }
        public DateTime? RequiredDate { get; set; }
        public DateTime? ShippedDate { get; set; }
        public string ShipperName { get; set; }
        public int ProductId { get; set; }
        public string ProductName { get; set; }
        public decimal UnitPrice { get; set; }
        public short Quantity { get; set; }
        public float Discount { get; set; }
        public decimal? ExtendedPrice { get; set; }
        public decimal? Freight { get; set; }
    }
}

NorthwindContext

using Microsoft.EntityFrameworkCore;
#nullable disable

namespace Grid.Northwind {
    public partial class NorthwindContext : DbContext {
        public NorthwindContext() {
        }

        public NorthwindContext(DbContextOptions<NorthwindContext> options)
            : base(options) {
        }
        // ...
        public virtual DbSet<Invoice> Invoices { get; set; }
        // ...
        protected override void OnConfiguring(DbContextOptionsBuilder optionsBuilder) {
            if(!optionsBuilder.IsConfigured) {
                optionsBuilder.UseSqlServer("Server=.\\sqlexpress;Database=Northwind;Integrated Security=true");
            }
        }
        // ...
        protected override void OnModelCreating(ModelBuilder modelBuilder) {
        // ...
            modelBuilder.Entity<Invoice>(entity => {
                entity.HasNoKey();
                entity.ToView("Invoices");
                entity.Property(e => e.Address).HasMaxLength(60);
                entity.Property(e => e.City).HasMaxLength(15);
                entity.Property(e => e.Country).HasMaxLength(15);
                entity.Property(e => e.CustomerId)
                    .HasMaxLength(5)
                    .HasColumnName("CustomerID")
                    .IsFixedLength(true);
                entity.Property(e => e.CustomerName)
                    .IsRequired()
                    .HasMaxLength(40);
                entity.Property(e => e.ExtendedPrice).HasColumnType("money");
                entity.Property(e => e.Freight).HasColumnType("money");
                entity.Property(e => e.OrderDate).HasColumnType("datetime");
                entity.Property(e => e.OrderId).HasColumnName("OrderID");
                entity.Property(e => e.PostalCode).HasMaxLength(10);
                entity.Property(e => e.ProductId).HasColumnName("ProductID");
                entity.Property(e => e.ProductName)
                    .IsRequired()
                    .HasMaxLength(40);
                entity.Property(e => e.Region).HasMaxLength(15);
                entity.Property(e => e.RequiredDate).HasColumnType("datetime");
                entity.Property(e => e.Salesperson)
                    .IsRequired()
                    .HasMaxLength(31);
                entity.Property(e => e.ShipAddress).HasMaxLength(60);
                entity.Property(e => e.ShipCity).HasMaxLength(15);
                entity.Property(e => e.ShipCountry).HasMaxLength(15);
                entity.Property(e => e.ShipName).HasMaxLength(40);
                entity.Property(e => e.ShipPostalCode).HasMaxLength(10);
                entity.Property(e => e.ShipRegion).HasMaxLength(15);
                entity.Property(e => e.ShippedDate).HasColumnType("datetime");
                entity.Property(e => e.ShipperName)
                    .IsRequired()
                    .HasMaxLength(40);
                entity.Property(e => e.UnitPrice).HasColumnType("money");
            });
            // ...
            OnModelCreatingPartial(modelBuilder);
        }
        // ...
    }
}

Startup

public class Startup {
// ...
    public void ConfigureServices(IServiceCollection services) {
    // ...
        services.AddEntityFrameworkSqlServer();
        services.AddDbContext<NorthwindContext>((sp, options) => {
            var env = sp.GetRequiredService<IWebHostEnvironment>();
            var dbPath = Path.Combine(env.ContentRootPath, "Northwind-5e44b51f.mdf");
            options.UseSqlServer("Server=(localdb)\\MSSQLLocalDB;Integrated Security=true;AttachDbFileName=" + dbPath);
        });
    }
    // ...
}

Implements

FooterColumnName