+
+
+ 
+
+
+ 
+
+
+
+
+
+## Branches
+
+> **_NOTE:_** You should use [master](https://github.com/IgniteUI/igniteui-blazor-examples/tree/master) branch of this repository if you want to run samples on your computer. Use the [vnext](https://github.com/IgniteUI/igniteui-blazor-examples/tree/vnext) branch only when you want to contribute new samples to this repository.
+
+## Setup
+
+- instal **.NET SDK** from this [website](https://dotnet.microsoft.com/learn/aspnet/blazor-tutorial/install)
+
+## Running App in Visual Studio 2019
+
+NOTE: VS 2019 has better code highlighting and error detection than VS Code does.
+
+- open **Visual Studio 2019** as an administrator
+
+- open the **BlazorClientApp.sln** solution
+
+- right click solution and select **Restore NuGet Packages** menu item
+
+- click **Debug** menu and select **Start Debugging** or press **F5** key
+
+
+## Running App in VS Code
+
+- open **VS Code** as an administrator
+
+- open this folder in **VS Code**
+
+- open a terminal window
+
+- to restore assemblies, run this command:
+```dotnet restore```
+
+- to run samples, run this command:
+```dotnet watch run```
+
+- wait for for message:
+**Now listening on: http://localhost:4200**
+
+- open **http://localhost:4200** in your browser
+
+
+## Resources
+
+- [Razor Component Models](https://www.codemag.com/article/1911052)
+- [Razor Syntax](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/?view=aspnetcore-3.1#razor-syntax)
+- [Getting reference to components](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/?view=aspnetcore-3.1#capture-references-to-components)
diff --git a/samples/grids/grid/disabled-summaries/_Imports.razor b/samples/grids/grid/disabled-summaries/_Imports.razor
new file mode 100644
index 0000000000..d27d337cb1
--- /dev/null
+++ b/samples/grids/grid/disabled-summaries/_Imports.razor
@@ -0,0 +1,9 @@
+// these namespaces are global to the app
+@using System.Net.Http
+@using System.Net.Http.Json
+@using Microsoft.AspNetCore.Components.Forms
+@using Microsoft.AspNetCore.Components.Routing
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.AspNetCore.Components.WebAssembly.Http
+@using Microsoft.JSInterop
+@using Infragistics.Samples
diff --git a/samples/grids/grid/disabled-summaries/wwwroot/events.js b/samples/grids/grid/disabled-summaries/wwwroot/events.js
new file mode 100644
index 0000000000..0c4cc923c4
--- /dev/null
+++ b/samples/grids/grid/disabled-summaries/wwwroot/events.js
@@ -0,0 +1,66 @@
+
+
+class WebGridDiscontinuedSummary {
+ operate(data, allData, fieldName) {
+ const result = [];
+ const values = allData.map((item) => item[fieldName] ?? 0).filter((value) => value !== null);
+
+ const discontinuedItems = allData.filter((item) => item["Discontinued"] === true);
+ const discontinuedValues = discontinuedItems.map((item) => item[fieldName] ?? 0).filter((value) => !isNaN(value));
+
+ result.push({ key: "count", label: "Count", summaryResult: values.length });
+ result.push({ key: "min", label: "Min", summaryResult: values.length > 0 ? Math.min(...values) : "N/A" });
+ result.push({ key: "max", label: "Max", summaryResult: values.length > 0 ? Math.max(...values) : "N/A" });
+ result.push({ key: "sum", label: "Sum", summaryResult: values.reduce((a, b) => a + b, 0) });
+ result.push({
+ key: "average",
+ label: "Average",
+ summaryResult: values.length > 0 ? values.reduce((a, b) => a + b, 0) / values.length : "N/A"
+ });
+ result.push({
+ key: "median",
+ label: "Median",
+ summaryResult:
+ values.length > 0
+ ? (() => {
+ const sortedValues = values.slice().sort((a, b) => a - b);
+ return sortedValues.length % 2 === 0 ? (sortedValues[sortedValues.length / 2 - 1] + sortedValues[sortedValues.length / 2]) / 2 : sortedValues[Math.floor(sortedValues.length / 2)];
+ })()
+ : "N/A"
+ });
+ result.push({ key: "range", label: "Range", summaryResult: values.length > 0 ? Math.max(...values) - Math.min(...values) : "N/A" });
+ result.push({ key: "discontinued", label: "Discontinued Products", summaryResult: discontinuedItems.length });
+ result.push({ key: "totalDiscontinued", label: "Total Discontinued Items", summaryResult: discontinuedValues.length > 0 ? discontinuedValues.reduce((a, b) => a + b, 0) : 0 });
+ return result;
+ }
+}
+
+class DiscontinuedSummary {
+ operate(data, allData, fieldName) {
+ const result = [];
+ result.push({ key: "count", label: "Count", summaryResult: allData.length });
+ result.push({ key: "true", label: "True", summaryResult: allData.filter((item) => item[fieldName] === true).length });
+ result.push({ key: "false", label: "False", summaryResult: allData.filter((item) => item[fieldName] === false).length });
+ return result;
+ }
+}
+
+igRegisterScript("ColumnInitScript", (event) => {
+ if (event.detail.field === "UnitsInStock") {
+ event.detail.summaries = WebGridDiscontinuedSummary;
+ } else if (event.detail.field === "Discontinued") {
+ event.detail.summaries = DiscontinuedSummary;
+ }
+}, false);
+
+
+window.getSummaries = (field) => {
+ const grid = document.getElementById("grid");
+ const col = grid.getColumnByName(field);
+ const summaryOperand = col?.summaries;
+ if (summaryOperand) {
+ let result = summaryOperand.operate([], grid.data, field).map(s => ({ [s.key]: s.label }));
+ return Object.assign({}, ...result);
+ }
+ return {};
+};
diff --git a/samples/grids/grid/disabled-summaries/wwwroot/index.css b/samples/grids/grid/disabled-summaries/wwwroot/index.css
new file mode 100644
index 0000000000..485fcca6e3
--- /dev/null
+++ b/samples/grids/grid/disabled-summaries/wwwroot/index.css
@@ -0,0 +1,38 @@
+/*
+CSS styles are loaded from the shared CSS file located at:
+https://static.infragistics.com/xplatform/css/samples/
+*/
+.fill {
+ padding: 16px;
+}
+
+.summaries-buttons {
+ margin: 1rem 0;
+ display: flex;
+ align-items: center;
+ flex-wrap: wrap;
+}
+
+.summaries-title {
+ font-weight: bold;
+}
+
+.summary-button {
+ margin-right: 1rem;
+}
+
+igc-dialog::part(title) {
+ color: #1E6DFE;
+}
+
+.summaries-dialog-items {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+}
+
+.summaries-dialog-items igc-checkbox {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+}
\ No newline at end of file
diff --git a/samples/grids/grid/disabled-summaries/wwwroot/index.html b/samples/grids/grid/disabled-summaries/wwwroot/index.html
new file mode 100644
index 0000000000..390c4352ca
--- /dev/null
+++ b/samples/grids/grid/disabled-summaries/wwwroot/index.html
@@ -0,0 +1,32 @@
+
+
+
+
+
+
+
+
+
+ 
+
+
+@code {
+ private IgbHierarchicalGrid hierarchicalGrid;
+ private IgbColumn artist;
+ private IgbColumn photo;
+ private IgbColumn debut;
+ private IgbColumn grammyNominations;
+ private IgbColumn grammyAwards;
+
+ private IgbColumn[] columns { get; set; } = [];
+ private IgbColumn currentColumn;
+
+ private Dictionary
+
+
+ Disable Summaries for Column:
+
+
+
+ Disable All
+ Enable All
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ @if (currentColumn != null && currentColumn.HasSummary && summaries.Count() > 0)
+ {
+ @foreach (var summary in this.summaries)
+ {
+ @summary.Value
+ }
+ }
+
+
+
+
+
+
+
+
+
+
+
+
+
+## Branches
+
+> **_NOTE:_** You should use [master](https://github.com/IgniteUI/igniteui-blazor-examples/tree/master) branch of this repository if you want to run samples on your computer. Use the [vnext](https://github.com/IgniteUI/igniteui-blazor-examples/tree/vnext) branch only when you want to contribute new samples to this repository.
+
+## Setup
+
+- instal **.NET SDK** from this [website](https://dotnet.microsoft.com/learn/aspnet/blazor-tutorial/install)
+
+## Running App in Visual Studio 2019
+
+NOTE: VS 2019 has better code highlighting and error detection than VS Code does.
+
+- open **Visual Studio 2019** as an administrator
+
+- open the **BlazorClientApp.sln** solution
+
+- right click solution and select **Restore NuGet Packages** menu item
+
+- click **Debug** menu and select **Start Debugging** or press **F5** key
+
+
+## Running App in VS Code
+
+- open **VS Code** as an administrator
+
+- open this folder in **VS Code**
+
+- open a terminal window
+
+- to restore assemblies, run this command:
+```dotnet restore```
+
+- to run samples, run this command:
+```dotnet watch run```
+
+- wait for for message:
+**Now listening on: http://localhost:4200**
+
+- open **http://localhost:4200** in your browser
+
+
+## Resources
+
+- [Razor Component Models](https://www.codemag.com/article/1911052)
+- [Razor Syntax](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/?view=aspnetcore-3.1#razor-syntax)
+- [Getting reference to components](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/?view=aspnetcore-3.1#capture-references-to-components)
diff --git a/samples/grids/hierarchical-grid/disabled-summaries/SingersData.cs b/samples/grids/hierarchical-grid/disabled-summaries/SingersData.cs
new file mode 100644
index 0000000000..a8a55455ca
--- /dev/null
+++ b/samples/grids/hierarchical-grid/disabled-summaries/SingersData.cs
@@ -0,0 +1,774 @@
+using System;
+using System.Collections.Generic;
+public class SingersDataItem
+{
+ public double ID { get; set; }
+ public string Artist { get; set; }
+ public string Photo { get; set; }
+ public double Debut { get; set; }
+ public double GrammyNominations { get; set; }
+ public double GrammyAwards { get; set; }
+ public bool HasGrammyAward { get; set; }
+ public List
+
+
+@code {
+ private IgbTreeGrid treeGrid;
+ private IgbColumn orderID;
+ private IgbColumn orderProduct;
+ private IgbColumn units;
+ private IgbColumn unitPrice;
+ private IgbColumn price;
+ private IgbColumn delivered;
+ private IgbColumn orderDate;
+
+ private IgbColumn[] columns { get; set; } = [];
+ private IgbColumn currentColumn;
+
+ private Dictionary
+
+
+ Disable Summaries for Column:
+
+
+ Disable All
+ Enable All
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ @if (currentColumn != null && currentColumn.HasSummary && summaries.Count() > 0)
+ {
+ @foreach (var summary in this.summaries)
+ {
+ @summary.Value
+ }
+ }
+
+
+
+
+
+
+
+
+
+
+
+
+
+## Branches
+
+> **_NOTE:_** You should use [master](https://github.com/IgniteUI/igniteui-blazor-examples/tree/master) branch of this repository if you want to run samples on your computer. Use the [vnext](https://github.com/IgniteUI/igniteui-blazor-examples/tree/vnext) branch only when you want to contribute new samples to this repository.
+
+## Setup
+
+- instal **.NET SDK** from this [website](https://dotnet.microsoft.com/learn/aspnet/blazor-tutorial/install)
+
+## Running App in Visual Studio 2019
+
+NOTE: VS 2019 has better code highlighting and error detection than VS Code does.
+
+- open **Visual Studio 2019** as an administrator
+
+- open the **BlazorClientApp.sln** solution
+
+- right click solution and select **Restore NuGet Packages** menu item
+
+- click **Debug** menu and select **Start Debugging** or press **F5** key
+
+
+## Running App in VS Code
+
+- open **VS Code** as an administrator
+
+- open this folder in **VS Code**
+
+- open a terminal window
+
+- to restore assemblies, run this command:
+```dotnet restore```
+
+- to run samples, run this command:
+```dotnet watch run```
+
+- wait for for message:
+**Now listening on: http://localhost:4200**
+
+- open **http://localhost:4200** in your browser
+
+
+## Resources
+
+- [Razor Component Models](https://www.codemag.com/article/1911052)
+- [Razor Syntax](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/?view=aspnetcore-3.1#razor-syntax)
+- [Getting reference to components](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/?view=aspnetcore-3.1#capture-references-to-components)
diff --git a/samples/grids/tree-grid/disabled-summaries/_Imports.razor b/samples/grids/tree-grid/disabled-summaries/_Imports.razor
new file mode 100644
index 0000000000..d27d337cb1
--- /dev/null
+++ b/samples/grids/tree-grid/disabled-summaries/_Imports.razor
@@ -0,0 +1,9 @@
+// these namespaces are global to the app
+@using System.Net.Http
+@using System.Net.Http.Json
+@using Microsoft.AspNetCore.Components.Forms
+@using Microsoft.AspNetCore.Components.Routing
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.AspNetCore.Components.WebAssembly.Http
+@using Microsoft.JSInterop
+@using Infragistics.Samples
diff --git a/samples/grids/tree-grid/disabled-summaries/wwwroot/events.js b/samples/grids/tree-grid/disabled-summaries/wwwroot/events.js
new file mode 100644
index 0000000000..3127ea6a6f
--- /dev/null
+++ b/samples/grids/tree-grid/disabled-summaries/wwwroot/events.js
@@ -0,0 +1,99 @@
+class UnitsSummary {
+ operate(data, allData, fieldName) {
+ const result = [];
+
+ const values = allData.map((rec) => rec[fieldName]).filter((value) => value !== undefined && value !== null);
+ const totalSum = values.reduce((sum, value) => sum + value, 0);
+ const sortedValues = values.slice().sort((a, b) => a - b);
+ const deliveredValues = allData
+ .filter((rec) => rec["Delivered"])
+ .map((rec) => rec[fieldName])
+ .filter((value) => value !== undefined && value !== null);
+
+ result.push({
+ key: "count",
+ label: "Count",
+ summaryResult: allData.length
+ });
+
+ result.push({
+ key: "min",
+ label: "Min",
+ summaryResult: values.length > 0 ? Math.min(...values) : "N/A"
+ });
+
+ result.push({
+ key: "max",
+ label: "Max",
+ summaryResult: values.length > 0 ? Math.max(...values) : "N/A"
+ });
+
+ result.push({
+ key: "sum",
+ label: "Sum",
+ summaryResult: totalSum
+ });
+
+ result.push({
+ key: "average",
+ label: "Average",
+ summaryResult: values.length > 0 ? totalSum / values.length : "N/A"
+ });
+
+ result.push({
+ key: "totalDelivered",
+ label: "Total Units Delivered",
+ summaryResult: deliveredValues.length > 0 ? deliveredValues.reduce((sum, value) => sum + value, 0) : "N/A"
+ });
+
+ result.push({
+ key: "medianUnits",
+ label: "Median Units",
+ summaryResult:
+ values.length > 0
+ ? (() => {
+ const mid = Math.floor(sortedValues.length / 2);
+ return sortedValues.length % 2 !== 0 ? sortedValues[mid] : (sortedValues[mid - 1] + sortedValues[mid]) / 2;
+ })()
+ : "N/A"
+ });
+
+ result.push({
+ key: "uniqueCount",
+ label: "Count of Unique Unit Values",
+ summaryResult: values.length > 0 ? new Set(values).size : "N/A"
+ });
+
+ result.push({
+ key: "maxDifference",
+ label: "Max Difference Between Units",
+ summaryResult:
+ values.length > 1
+ ? values.reduce((maxDiff, value, idx, arr) => {
+ if (idx === 0) return maxDiff;
+ const diff = Math.abs(value - arr[idx - 1]);
+ return Math.max(maxDiff, diff);
+ }, 0)
+ : "N/A"
+ });
+
+ return result;
+ }
+}
+
+igRegisterScript("ColumnInitScript", (event) => {
+ if (event.detail.field === "Units") {
+ event.detail.summaries = UnitsSummary;
+ }
+}, false);
+
+window.getSummaries = (field) => {
+ const grid = document.getElementById("treeGrid");
+ const col = grid.getColumnByName(field);
+ const summaryOperand = col?.summaries;
+ if (summaryOperand) {
+ let result = summaryOperand.operate([], grid.data, field).map(s => ({ [s.key]: s.label }));
+ return Object.assign({}, ...result);
+ }
+ return {};
+};
diff --git a/samples/grids/tree-grid/disabled-summaries/wwwroot/index.css b/samples/grids/tree-grid/disabled-summaries/wwwroot/index.css
new file mode 100644
index 0000000000..01ef6e3ab5
--- /dev/null
+++ b/samples/grids/tree-grid/disabled-summaries/wwwroot/index.css
@@ -0,0 +1,38 @@
+/*
+CSS styles are loaded from the shared CSS file located at:
+https://static.infragistics.com/xplatform/css/samples/
+*/
+.fill {
+ padding: 16px;
+}
+
+.summaries-buttons {
+ margin: 1rem 0;
+ display: flex;
+ align-items: center;
+ flex-wrap: wrap;
+}
+
+.summaries-title {
+ font-weight: bold;
+}
+
+.summary-button {
+ margin-right: 1rem;
+}
+
+igc-dialog::part(title) {
+ color: #1E6DFE;
+}
+
+.summaries-dialog-items {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+}
+
+ .summaries-dialog-items igc-checkbox {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ }
diff --git a/samples/grids/tree-grid/disabled-summaries/wwwroot/index.html b/samples/grids/tree-grid/disabled-summaries/wwwroot/index.html
new file mode 100644
index 0000000000..6ea07bab27
--- /dev/null
+++ b/samples/grids/tree-grid/disabled-summaries/wwwroot/index.html
@@ -0,0 +1,33 @@
+
+
+
+
+
+
+
+
+
+