When I had a GroupFooterTemplate inside my composite table column, the colspan of the column is not respected
The one for the FooterTemplate is correctly displayed.
On top of that the style/font-size of the groupfootertemplate is different even thought I didn't change it.
PS the footertemplate is bold as I display it as bold
Check our forum FAQ for details on how to improve your post.
My Bad
Here the code to display the grid
<RadzenDataGrid AllowCompositeDataCells="true" AllowGrouping="false" AllowFiltering="true" AllowSorting="true"
Style=@razdenTableHeight TItem="BillData"
Data="@Items" Density="Density.Compact" GroupFootersAlwaysVisible="true">
<GroupHeaderTemplate>
@(context.Data.Key ?? "") (<Radz style="color:red"> @context.Data.Count items</Radz>)
</GroupHeaderTemplate>
<Columns>
<RadzenDataGridColumn Title="SoW" Property="@nameof(BillData.SoW)" />
<RadzenDataGridColumn Title="Reference" Property="@nameof(BillData.Ref)" />
<RadzenDataGridColumn Title="Current Period" Filterable="false" TextAlign="TextAlign.End">
<Columns>
<RadzenDataGridColumn Property="@nameof(BillData.Quantity)" Title="Quantity"
TextAlign="TextAlign.End" Filterable="true"
FormatProvider="@cultureFormatProvider" FormatString="@razdenstringNumberFormat" />
<RadzenDataGridColumn Property="@nameof(BillData.UnitPrice)" Title="Price"
TextAlign="TextAlign.End" Filterable="true"
FormatProvider="@cultureFormatProvider" FormatString="@razdenstringCurrencyFormat" />
<RadzenDataGridColumn Property="@nameof(BillData.Total)" Title="Total"
TextAlign="TextAlign.End" Filterable="true"
FormatProvider=@cultureFormatProvider FormatString="@razdenstringCurrencyFormat" />
</Columns>
<GroupFooterTemplate>
@(context.Data.Items.Cast<BillData>().Sum(o => o.Total).ToString(stringCurrencyFormat, cultureFormatProvider))
</GroupFooterTemplate>
<FooterTemplate>
<b>@(Items.Average(o => o.Total).ToString(stringCurrencyFormat, cultureFormatProvider))</b>
</FooterTemplate>
</RadzenDataGridColumn>
<RadzenDataGridColumn Title="Finalized" TextAlign="TextAlign.End" Filterable="false">
<Columns>
<RadzenDataGridColumn Property="@nameof(BillData.FinalizeQuantity)"
Title="Quantity" TextAlign="TextAlign.End"
FormatProvider="@cultureFormatProvider" FormatString="@razdenstringNumberFormat" />
<RadzenDataGridColumn Property="@nameof(BillData.FinalizeUnitPrice)"
Title="Price" TextAlign="TextAlign.End"
FormatProvider=@cultureFormatProvider FormatString="@razdenstringCurrencyFormat"/>
<RadzenDataGridColumn Property="@nameof(BillData.FinalizeTotal)"
Title="Total" TextAlign="TextAlign.End"
FormatProvider=@cultureFormatProvider FormatString="@razdenstringCurrencyFormat"/>
</Columns>
<GroupFooterTemplate>
@(context.Data.Items.Cast<BillData>().Sum(o => o.FinalizeTotal).ToString(stringCurrencyFormat, cultureFormatProvider))
</GroupFooterTemplate>
<FooterTemplate>
<b>@(Items.Sum(o => o.FinalizeTotal).ToString(stringCurrencyFormat, cultureFormatProvider))</b>
</FooterTemplate>
</RadzenDataGridColumn>
<RadzenDataGridColumn Title="Delta" TextAlign="TextAlign.End" Filterable="false">
<Columns>
<RadzenDataGridColumn Property="@nameof(BillData.DeltaQuantity)" Title="Quantity" TextAlign="TextAlign.End">
<Template>
@{
var arrowInfo = GetArrowInfoRazden(context.DeltaQuantity);
}
@context.DeltaQuantity <RadzenIcon Icon=@arrowInfo.icon IconStyle=@arrowInfo.style />
</Template>
</RadzenDataGridColumn>
<RadzenDataGridColumn Property="@nameof(BillData.DeltaUnitPrice)" Title="Price" TextAlign="TextAlign.End">
<Template>
@{
var arrowInfo = GetArrowInfoRazden(context.DeltaUnitPrice);
}
@context.DeltaUnitPrice.ToString(stringCurrencyFormat, cultureFormatProvider) <RadzenIcon Icon=@arrowInfo.icon IconStyle=@arrowInfo.style />
</Template>
</RadzenDataGridColumn>
<RadzenDataGridColumn Property="@nameof(BillData.DeltaTotal)" Title="Total" TextAlign="TextAlign.End">
<Template>
@{
var arrowInfo = GetArrowInfoRazden(context.DeltaTotal);
}
@context.DeltaTotal.ToString(stringCurrencyFormat, cultureFormatProvider) <RadzenIcon Icon=@arrowInfo.icon IconStyle=@arrowInfo.style />
</Template>
</RadzenDataGridColumn>
</Columns>
<GroupFooterTemplate>
@{
var deltaTotal = context.Data.Items.Cast<BillData>().Sum(o => o.DeltaTotal);
var arrowInfo = GetArrowInfoRazden(deltaTotal);
}
@(deltaTotal.ToString(stringCurrencyFormat, cultureFormatProvider)) <RadzenIcon Icon=@arrowInfo.icon IconStyle=@arrowInfo.style />
</GroupFooterTemplate>
<FooterTemplate>
@{
var deltaTotal = Items.Sum(o => o.DeltaTotal);
var arrowInfo = GetArrowInfoRazden(deltaTotal);
}
<b>@(deltaTotal.ToString(stringCurrencyFormat, cultureFormatProvider)) <RadzenIcon Icon=@arrowInfo.icon IconStyle=@arrowInfo.style /></b>
</FooterTemplate>
</RadzenDataGridColumn>
</Columns>
</RadzenDataGrid>
@code{
public IEnumerable<BillData>? Items { get; set; }
private static CultureInfo cultureFormatProvider = new CultureInfo("fr-FR");
private const string tableHeight = "700px";
private const string stringCurrencyFormat = "C4";
private const string razdenTableHeight = $"height:{tableHeight}";
private const string razdenstringNumberFormat = $"{{0:F4}}";
private const string razdenstringCurrencyFormat = $"{{0:{stringCurrencyFormat}}}";
private (IconStyle? style, string icon) GetArrowInfoRazden(double value) => value switch
{
> 0 => (style: IconStyle.Success, icon: "arrow_upward"),
< 0 => (style: IconStyle.Danger, icon: "arrow_downward"),
_ => (style: null, icon: "")
};
protected override async Task OnInitializedAsync()
{
await base.OnInitializedAsync();
Items = await BillingService.GetBillingData();
}
void OnRender(DataGridRenderEventArgs<BillData> args)
{
if (args.FirstRender)
{
args.Grid.Groups.Add(new GroupDescriptor() { Title = "SoW", Property = "SoW" });
StateHasChanged();
}
}
}
here the Items structure
public record BillData(string Sow, string Ref, double Quantity, double UnitPrice, double FinalizeQuantity, double FinalizeUnitPrice)
{
public double Total {get => Quantity * UnitPrice;}
public double FinalizeTotal { get => FinalizeQuantity * FinalizeUnitPrice; }
public double DeltaQuantity { get => FinalizeQuantity - Quantity; }
public double DeltaUnitPrice { get => FinalizeUnitPrice - UnitPrice; }
public double DeltaTotal { get => FinalizeTotal - Total; }
}
Not sure what's that component. Can you try to use some of our demos to replicate your case? We need runnable code.
UPDATE: I was able to replicate the problem with the following code from and this demo:
<RadzenDataGrid @ref="ordersGrid" ColumnWidth="220px" AllowGrouping="false" AllowFiltering="true" AllowPaging="true" AllowSorting="true"
Data="@orders" Render="@OnRender">
<GroupHeaderTemplate>
@context.GroupDescriptor.GetTitle(): @(context.Data.Key ?? ""), Group items count: @context.Data.Count, Last order date: @(context.Data.Items.Cast<Order>().OrderByDescending(o => o.OrderDate).FirstOrDefault()?.OrderDate)
</GroupHeaderTemplate>
<Columns>
<RadzenDataGridColumn Width="50px" Title="#" Filterable="false" Sortable="false" TextAlign="TextAlign.Center">
<Template>
@(orders.IndexOf(context) + 1)
</Template>
<FooterTemplate>
Total amount: <b>@String.Format(new System.Globalization.CultureInfo("en-US"), "{0:C}", orders.Sum(o => o.Freight))</b>
</FooterTemplate>
<GroupFooterTemplate>
Group amount: <b>@String.Format(new System.Globalization.CultureInfo("en-US"), "{0:C}", context.Data.Items.Cast<Order>().Sum(o => o.Freight))</b>
</GroupFooterTemplate>
</RadzenDataGridColumn>
<RadzenDataGridColumn Property="OrderID" Title="Order ID">
<FooterTemplate>
Displayed orders: <b>@ordersGrid.View.Count()</b> of <b>@orders.Count()</b>
</FooterTemplate>
<Columns>
<RadzenDataGridColumn Property="@nameof(Order.Freight)" Title="Freight">
<Template Context="order">
@String.Format(new System.Globalization.CultureInfo("en-US"), "{0:C}", order.Freight)
</Template>
</RadzenDataGridColumn>
<RadzenDataGridColumn Property="@nameof(Order.OrderDate)" Title="Order Date" FormatString="{0:d}">
<FooterTemplate>
Last order date: <b>@String.Format("{0:d}", orders.OrderByDescending(o => o.OrderDate).LastOrDefault()?.OrderDate)</b>
</FooterTemplate>
</RadzenDataGridColumn>
</Columns>
</RadzenDataGridColumn>
<RadzenDataGridColumn Width="160px" Property="@nameof(Order.ShipName)" Title="Ship Name" />
<RadzenDataGridColumn Width="160px" Property="Employee.LastName" Title="Employee">
<Template Context="order">
@order.Employee?.FirstName @order.Employee?.LastName
</Template>
</RadzenDataGridColumn>
</Columns>
</RadzenDataGrid>
We will do our best to provide fix as soon as possible.
