diff --git a/CS/BindGridToLargeData/BindGridToLargeData.csproj b/CS/BindGridToLargeData/BindGridToLargeData.csproj index 7617ba0..25cb2a2 100644 --- a/CS/BindGridToLargeData/BindGridToLargeData.csproj +++ b/CS/BindGridToLargeData/BindGridToLargeData.csproj @@ -5,7 +5,7 @@ enable - + diff --git a/CS/BindGridToLargeData/Components/Layout/NavMenu.razor b/CS/BindGridToLargeData/Components/Layout/NavMenu.razor index b29d03f..d8183b0 100644 --- a/CS/BindGridToLargeData/Components/Layout/NavMenu.razor +++ b/CS/BindGridToLargeData/Components/Layout/NavMenu.razor @@ -2,7 +2,6 @@ - - \ No newline at end of file + diff --git a/CS/BindGridToLargeData/Components/Pages/Index.razor b/CS/BindGridToLargeData/Components/Pages/Index.razor index 9218c47..90d831c 100644 --- a/CS/BindGridToLargeData/Components/Pages/Index.razor +++ b/CS/BindGridToLargeData/Components/Pages/Index.razor @@ -7,12 +7,15 @@ @rendermode InteractiveServer
- + - @@ -31,4 +34,4 @@ public void Dispose() { Northwind?.Dispose(); } -} \ No newline at end of file +} diff --git a/CS/BindGridToLargeData/Components/Pages/Weather.razor b/CS/BindGridToLargeData/Components/Pages/Weather.razor deleted file mode 100644 index 7b1bc37..0000000 --- a/CS/BindGridToLargeData/Components/Pages/Weather.razor +++ /dev/null @@ -1,35 +0,0 @@ -@page "/weather" - -@using BindGridToLargeData.Services -@attribute [StreamRendering(true)] -@rendermode InteractiveServer -@inject WeatherForecastService ForecastService - -Weather -

Weather

- -@if (forecasts == null) -{ -

Loading...

-} -else -{ - - - - - - - - -} - -@code { - private WeatherForecast[]? forecasts; - - protected override async Task OnInitializedAsync() - { - forecasts = await ForecastService.GetForecastAsync(DateOnly.FromDateTime(DateTime.Now)); - } -} \ No newline at end of file diff --git a/CS/BindGridToLargeData/Program.cs b/CS/BindGridToLargeData/Program.cs index cb1a2c5..26da60d 100644 --- a/CS/BindGridToLargeData/Program.cs +++ b/CS/BindGridToLargeData/Program.cs @@ -1,6 +1,5 @@ using BindGridToLargeData.Components; using BindGridToLargeData.Models; -using BindGridToLargeData.Services; using Microsoft.EntityFrameworkCore; var builder = WebApplication.CreateBuilder(args); @@ -19,7 +18,6 @@ var dbPath = Path.Combine(env.ContentRootPath, "Northwind.db"); options.UseSqlite("Data Source=" + dbPath); }); -builder.Services.AddSingleton(); builder.Services.AddMvc(); var app = builder.Build(); diff --git a/CS/BindGridToLargeData/Services/WeatherForecast.cs b/CS/BindGridToLargeData/Services/WeatherForecast.cs deleted file mode 100644 index f87eb5e..0000000 --- a/CS/BindGridToLargeData/Services/WeatherForecast.cs +++ /dev/null @@ -1,11 +0,0 @@ -namespace BindGridToLargeData.Services { - public class WeatherForecast { - public DateOnly Date { get; set; } - - public int TemperatureC { get; set; } - - public int TemperatureF => 32 + (int)(TemperatureC / 0.5556); - - public string? Summary { get; set; } - } -} \ No newline at end of file diff --git a/CS/BindGridToLargeData/Services/WeatherForecastService.cs b/CS/BindGridToLargeData/Services/WeatherForecastService.cs deleted file mode 100644 index 52318c4..0000000 --- a/CS/BindGridToLargeData/Services/WeatherForecastService.cs +++ /dev/null @@ -1,17 +0,0 @@ -namespace BindGridToLargeData.Services { - public class WeatherForecastService { - private static readonly string[] Summaries = new[] - { - "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching" - }; - - public Task GetForecastAsync(DateOnly startDate) { - var rng = new Random(); - return Task.FromResult(Enumerable.Range(1, 20).Select(index => new WeatherForecast { - Date = startDate.AddDays(index), - TemperatureC = rng.Next(-20, 55), - Summary = Summaries[rng.Next(Summaries.Length)] - }).ToArray()); - } - } -} \ No newline at end of file diff --git a/README.md b/README.md index f777056..4d1dcf2 100644 --- a/README.md +++ b/README.md @@ -1,34 +1,40 @@ -![](https://img.shields.io/endpoint?url=https://codecentral.devexpress.com/api/v1/VersionRange/902698768/24.1.3%2B) [![](https://img.shields.io/badge/Open_in_DevExpress_Support_Center-FF7200?style=flat-square&logo=DevExpress&logoColor=white)](https://supportcenter.devexpress.com/ticket/details/T1268112) [![](https://img.shields.io/badge/📖_How_to_use_DevExpress_Examples-e9f6fc?style=flat-square)](https://docs.devexpress.com/GeneralInformation/403183) [![](https://img.shields.io/badge/💬_Leave_Feedback-feecdd?style=flat-square)](#does-this-example-address-your-development-requirementsobjectives) -# Product/Platform - Task +# Grid for Blazor - How to bind the component to a DevExtreme data source with Entity Framework Core -This is the repository template for creating new examples. Describe the solved task here. +This example uses [Entity Framework Core](https://learn.microsoft.com/en-us/ef/core/) data access technology to bind the [DevExpress Blazor Grid](https://docs.devexpress.com/Blazor/403143/components/grid) component to a [GridDevExtremeDataSource](https://docs.devexpress.com/Blazor/DevExpress.Blazor.GridDevExtremeDataSource-1). -Put a screenshot that illustrates the result here. +![Bind the Grid to a DevExtreme Data Source](bind-to-devextreme-data-source.png) -Then, add implementation details (steps, code snippets, and other technical information in a free form), or add a link to an existing document with implementation details. +You can use the [GridDevExtremeDataSource](https://docs.devexpress.com/Blazor/DevExpress.Blazor.GridDevExtremeDataSource-1) class to bind the DevExpress Blazor Grid to a large [IQueryable](https://learn.microsoft.com/en-us/dotnet/api/system.linq.iqueryable-1) data collection. This data source implementation is based on our [DevExtreme.AspNet.Data](https://github.com/DevExpress/DevExtreme.AspNet.Data) library. When you use this data source, the Grid delegates data filtering operations to an underlying query provider (such as [EF Core](https://learn.microsoft.com/en-us/ef/core/)) and only loads data required for screen display. This technique optimizes performance and reduces overall memory consumption. + +To use this data source in your next Blazor project, create a [GridDevExtremeDataSource](https://docs.devexpress.com/Blazor/DevExpress.Blazor.GridDevExtremeDataSource-1) class instance and pass your [IQueryable](https://learn.microsoft.com/en-us/dotnet/api/system.linq.iqueryable-1) data collection as the constructor parameter. Once complete, assign this instance to the Grid's Data property. + +Refer to the following help topic for more information about this data source, its specifics, and limitations: [Bind Blazor Grid to Data](https://docs.devexpress.com/Blazor/403737/components/grid/bind-to-data#large-data-queryable-collections). ## Files to Review -- link.cs (VB: link.vb) -- link.js -- ... +- [Index.razor](./CS/BindGridToLargeData/Components/Pages/Index.razor) +- [Index.razor.css](./CS/BindGridToLargeData/Components/Pages/Index.razor.css) +- [Invoice.cs](./CS/BindGridToLargeData/Models/Invoice.cs) +- [NorthwindContext.cs](./CS/BindGridToLargeData/Models/NorthwindContext.cs) +- [Program.cs](./CS/BindGridToLargeData/Program.cs) ## Documentation -- link -- link -- ... +- [Bind Blazor Grid to Data](https://docs.devexpress.com/Blazor/403737/components/grid/bind-to-data) +- [Bind Components to Data with Entity Framework Core](https://docs.devexpress.com/Blazor/403167/common-concepts/data-binding/bind-components-to-data-with-entity-framework-core) ## More Examples -- link -- link -- ... +- [How to bind the Grid to a DataTable object](https://github.com/DevExpress-Examples/blazor-grid-bind-to-datatable-object) +- [How to bind the Grid to data with Entity Framework Core](https://github.com/DevExpress-Examples/blazor-dxgrid-bind-to-data-with-entity-framework-core) +- [How to bind the Grid to an Instant Feedback data source and enable edit operations](https://github.com/DevExpress-Examples/blazor-dxgrid-bind-to-instant-feedback-data-source) +- [How to bind the Grid to a Web API service](https://github.com/DevExpress-Examples/blazor-DxGrid-Bind-To-Web-Api-Service) + ## Does this example address your development requirements/objectives? diff --git a/bind-to-devextreme-data-source.png b/bind-to-devextreme-data-source.png new file mode 100644 index 0000000..88848d1 Binary files /dev/null and b/bind-to-devextreme-data-source.png differ