Grid Component - Telerik UI for BlazorProgress Software The Blazor Data Grid is a full featured data visualization and editing component that works in both Blazor WebAssembly (WASM) and server-side Blazor apps. Learn more about Blazor Data Grid.
The Telerik UI for Blazor Data Grid component allows you to display large amounts of data in a table, then page, filter, sort and group over it, let user edit data and have their input validated. All you need to do is provide data to the grid, enable the features you want through simple parameters and we will do the rest to ensure beautiful display and great performance. You can also tweak the visualization through templates and your own CSS styles.
Grid Filtering
When you are looking for a certain record, or for rows that match a given criteria, you need to filter the data set. The Telerik Blazor grid lets your users do that effortlessly. The two different filtering modes offer different experiences—the always available Filter Row lets them type and filter immediately, while the Filter Menu takes up less real estate and lets them build more complex queries. Editing Data in Grid
The Telerik Blazor grid component lets your end users edit the data. They can alter or delete existing records or insert new ones—all the CRUD operations are conveniently exposed through events that give you the user action and the model, so all you have to do is add your business logic and call your data service. The grid also offers three built-in editing modes:
Grid Grouping
You can group the Blazor grid according to the values in different fields to see relationships between them, aggregates over the given groups and nest groups within groups to explore the data. Just set the Groupable parameter to true and you can simply drag the column headers to group by them. Grid Virtual Scrolling
Some users prefer to scroll through the data instead of using a pager. With large data sets, this can easily slow down your application. Telerik Grid avoids that by enabling Virtual Scrolling. It renders only the rows from the current page of data and swaps them as the user scrolls, instead of rendering a row for each and every item in the data source. You can even load on demand the next page, instead of providing all the data at once. Grid Data BindingIn the simplest case, you just point the data parameter of the Blazor Grid to your data collection and define the columns you want in it. The grid will do everything else for you (paging, sorting, filtering and so on). Grid Accessibility and Keyboard NavigationUsers with disabilities need to use your site as well, and the Telerik Grid component helps in that regard – it uses semantic markup and covers the current accessibility standards (including WCAG, Section 508 and WAI-ARIA attributes for screen readers). Moreover, you can navigate around the grid and invoke all actions with the keyboard alone. Useful Resources |
