Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merge marketing-recommendations-2391 into production #2393

Merged
merged 3 commits into from
Sep 24, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 5 additions & 3 deletions components/grid/refresh-data.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ position: 53

# Grid - Refresh Data

@[template](/_contentTemplates/common/observable-data.md#intro)
One of the key features of Telerik UI for Blazor Grid component is its ability to refresh the displayed data. This ensures that the Grid always presents the most up-to-date information, no matter if you are working with large datasets or frequently changing data sources. Understanding how to efficiently refresh the data in the Grid is crucial for maintaining both optimal performance and user experience. This guide covers various methods and best practices for refreshing data in the Telerik UI for Blazor Grid, helping you choose the right approach for your specific application needs related to Blazor DataGrid live update.

In this article:

Expand Down Expand Up @@ -106,14 +106,16 @@ You can refresh the Grid data by using the `Rebind` method exposed to the refere

## Observable Data

@[template](/_contentTemplates/common/observable-data.md#intro)

@[template](/_contentTemplates/common/observable-data.md#observable-data)

@[template](/_contentTemplates/common/observable-data.md#observable-data-onread-note)

>caption Bind the Grid to an ObservableCollection, so it can react to collection changes.

````CSHTML
@* Add/remove employee to see how the Grid reacts to that change. *@
@* Add/remove employee to see the Blazor DataGrid live update in action. *@

@using System.Collections.ObjectModel

Expand Down Expand Up @@ -369,7 +371,7 @@ This means that you need to ensure that the view-model will be updated as well,

* Update the local view-model data yourself with the information the grid event gives you (e.g., insert the new item in it, or remove a deleted item, or update the fields of an edited item). You can find similar code used in the [Grid - Inline Editing Live Demo](https://demos.telerik.com/blazor-ui/grid/editing-inline).

* It is important to ensure the change happens on the object the grid uses. Methods like `.FirstOrDefault()` may return a new reference and thus changing them may not trigger are UI update.
* It is important to ensure the change happens on the object that the Grid uses. Methods like `.FirstOrDefault()` will return a new reference and changing them will not trigger a UI update.


## See Also
Expand Down
4 changes: 3 additions & 1 deletion components/grid/virtual-scrolling.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
title: Virtual Scrolling
page_title: Grid - Virtual Scrolling
description: Enable and configure virtualization in the Blazor Grid with virtual scrolling - an alternative to paging.
description: Enable and configure virtualization in Blazor Grid with virtual scrolling - an alternative to paging.
slug: components/grid/virtual-scrolling
tags: telerik,blazor,grid,virtual,scrolling
published: True
Expand All @@ -18,6 +18,8 @@ You can also use the Blazor Grid virtualization for the Grid columns. See the [C

## Using Virtual Scrolling

For the Blazor Grid virtualization to work, you need to:

1. Set the `ScrollMode` parameter to `GridScrollMode.Virtual` (the default value is `Scrollable`).
1. [Set the `Height` parameter](#setting-a-value-for-the-height-parameter).
1. [Set the `RowHeight` parameter](#setting-a-value-for-the-rowheight-parameter).
Expand Down
Loading