Kendo UI for Angular Data Grid Component

• This package is part of the Kendo UI for Angular—a commercial UI library.
• You must install a license key when adding the package to your project. To receive a license key, either purchase a license or register for a free trial.
• The 30-day free trial gives you access to all the Kendo UI for Angular components and their full functionality. Additionally, for the period of your license, you get access to our legendary technical support provided directly by the Kendo UI for Angular team!

The Kendo UI for Angular Data Grid includes a comprehensive set of ready-to-use features covering everything from paging, sorting, filtering, editing, and grouping to row and column virtualization, exporting to PDF and Excel, and accessibility support. This Data Grid Component (sometimes called a Data Table) is built on Angular from the ground up, by a company with a long history of making enterprise-ready Grids. This results in an Angular data grid that delivers lighting fast performance and is highly customizable.

Key Features

Among the many features which the Kendo UI for Angular Grid delivers are:

• Data Binding—The Grid supports various binding methods to accommodate different requirements, including binding to an array of objects or a GridDataResult object, as well as utilizing a server to fetch remote data for dynamic content. Read more about the data binding functionality of the Grid...

• Editing—Depending on your users' requirements, you can opt for the inline or the in-cell edit modes using either the Template-Driven or Reactive forms. The Grid provides further customization options such as editing from an external form or Redux Form. Read more about the editing feature of the Data Grid...

• Paging—The Grid enables you to split its content into pages by adding a pager. The pager provides an extensive set of configuration options such as implementing a responsive behavior, customizing its appearance, defining the space between its elements, and more. Read more about the pager options of the Grid...

• Sorting—The Grid supports a number of sorting options. These options include the sorting and unsorting of single and multiple columns, pre-sorting data records, setting the sorting direction, and more. Read more about the sorting options of the Grid...

• Filtering—The Grid provides options for displaying only those data records which meet specified criteria. The component also allows you to additionally customize its filtering behavior by using its built-in filter templates or reusable custom filter components. Read more about filtering the Grid records...

• Grouping—Out of the box, you can apply dynamic grouping to the data Grid records, set grouping by aggregate values, and, in the same way as with the sorting functionality, pre-group the data. Read more about grouping the records of the Grid...

• Exporting to PDF and Excel—When implementing the Grid export to PDF, you can set the fonts, the exact portion and layout of the exported content, also customize the columns and other elements of the output result. When exporting to Excel, you can export specific data and customize the exported columns. Read more on exporting the Grid to PDF and exporting the Grid to Excel.

• Rows Options—The Data Grid provides an extensive collection of row configuration options, including:

  • Row selection—Allows you to select rows through interaction with the row itself or a checkbox. Supports single and multiple row selection.
  • Sticky rows—Allows you to display specific rows at all times even when user scrolls the data table.
  • Detail row template—Allows you to render supplementary information about the data in a specific row. Supports persisting the expanded state of the detail row.
  • Row reordering—Allows you to reorder rows by dragging and dropping them.
  • Row styling—Allows you to style the rows of the Grid using a callback function.

• Columns Options—The Data Grid provides an extensive collection of column configuration options, including:

  • Hiding columns—Allows you to show or hide columns.
  • Spanning columns—Spanning of the row content over multiple cells of data.
  • Setting multi-column headers—Grouping columns under a common header.
  • Column menu for quick actions—You can show or hide columns, filter, sort, and group them.
  • Locking (freezing) columns or sticking columns—Allows you to display specific column data at all times.
  • Reordering columns—You can reorder any column and with any available Grid feature, including locked columns.
  • Resizing columns—Allows you to resize columns in real-time by dragging the edges of the column headers.
  • Styling columns—Allows you to style the columns of the Grid using a callback function.

• Virtualization—The Data Grid supports a virtual scroll mode for its row data, which means that the component dynamically renders only a portion of the rows. This virtualization approach boosts the performance of the component when it has to display large data tables. Read more about the virtualization feature of the Grid...

• Sizing—The Grid provides predefined options which allow you to set the different padding to the Grid building blocks. For more information, refer to the sizing options of the Grid.

• Styling—Our components are designed to look great out of the box, but we understand that every application is different. That's why the Progress Design System Kit provides resources to help you customize the look and feel of your Kendo UI for Angular Data Grid component. If time is of the essence, our ThemeBuilder application can help you quickly and seamlessly modify the component's appearance.

• Chart Integration—The Grid provides built-in options that allow you to quickly generate charts using its data thus visually represent trends, patterns, and more. Read more about the Grid Chart integration...

• Globalization—The Kendo UI for Angular Data Grid supports globalization to ensure that it can fit well in any application, no matter what languages and locales need to be supported. Additionally, the Grid supports rendering in a right-to-left (RTL) direction. Read more about the globalization of the Grid...

• Accessibility—The Data Grid is WCAG 2.2 AA and Section 508 compliant, incorporating WAI-ARIA best practices for modern web accessibility. The Grid is also tested against the popular screen readers, including JAWS and NVDA. Read more about the accessibility of the Grid...

• Keyboard Navigation—The Data Grid supports a number of keyboard shortcuts which allow users to accomplish various commands. Read more about the keyboard navigation of the Grid...

Support Options

For any issues you might encounter while working with the Kendo UI for Angular Grid, you have the following support channels available:

• Industry-leading technical support—Kendo UI for Angular paid license holders and users with an active (free) trial license can take advantage of our outstanding customer support. To submit a ticket, use the dedicated Kendo UI for Angular support system.
• Product forums—The Kendo UI for Angular forums are part of the free support you can get from the community and from the Kendo UI for Angular team.
• Feedback portal—The Kendo UI for Angular feedback portal is where you can request and vote for new features to be added.

Resources

• Getting Started with Kendo UI for Angular
• Getting Started with the Kendo UI for Angular Grid
• Demos, documentation, and component reference
• Blogs
• Kendo UI for Angular pricing and licensing

Copyright © 2024 Progress Software Corporation and/or one of its subsidiaries or affiliates. All rights reserved.

Progress, Telerik, and certain product names used herein are trademarks or registered trademarks of Progress Software Corporation and/or one of its subsidiaries or affiliates in the U.S. and/or other countries.