@syncfusion/ej2-ng-grids

ej2-ng-grids

The Grid component is used to display and manipulate tabular data with configuration options to control the way the data is presented and manipulated. It will pull data from a data source, such as array of JSON objects, OData web services, or DataManager binding data fields to columns. Also displaying a column header to identify the field with support for grouped records.

Grid is part of Syncfusion Essential JS 2 commercial program. License is available in two models Community and Paid. Please refer the license file for more information. License can be obtained by registering at https://www.syncfusion.com/downloads/essential-js2

Setup

To install Grid and its dependent packages, use the following command

npm install @syncfusion/ej2-ng-grids

Resources

• Getting Started
• View Online Demos
• Product Page

Supported Frameworks

Grid component is also offered in following list of frameworks.

1. React
2. JavaScript (ES5)
3. ASP.NET Core
4. ASP.NET MVC

Showcase samples

• Expanse Tracker (Source, Live Demo)
• Loan Calculator (Source, Live Demo)

Key Features

• Data sources - Bind the Grid component with an array of JSON objects or DataManager.
• Async pipe - Bind the Grid component with RxJS.Observable using async pipe.
• Sorting and grouping - Supports n levels of sorting and grouping.
• Filtering - Offers filter bar at each column to filter data.
• Paging - Provides the option to easily switch between pages using the pager bar.
• Editing - provides the options for create, read, update, and delete operations.
• Columns - The column definitions are used as the dataSource schema in the Grid. This plays a vital role in rendering column values in the required format.
  • Reordering - Allows you to drag any column and drop it at any position in the Grid’s column header row, allowing columns to be repositioned.
  • Column Chooser - The column chooser provides a list of column names paired with check boxes that allow the visibility to be toggled on the fly.
  • Resizing - Resizing allows changing column width on the fly by simply dragging the right corner of the column header.
  • Freeze - Columns and rows can be frozen to allow scrolling and comparing cell values.
  • Cell Spanning - Grid cells can be spanned based on the preferred criteria.
  • Foreign data source - This provides the option to show values from external or lookup data sources in a column based on foreign key/value mapping.
  • Cell Styling - Grid cell styles can be customized either by using CSS or programmatically.
• Selection - Rows or cells can be selected in the grid. One or more rows or cells can also be selected by holding Ctrl or Command, or programmatically.
• Templates - Templates can be used to create custom user experiences in the grid.
• Aggregation - Provides the option to easily visualized the Aggregates for column values.
• Context menu -The context menu provides a list of actions to be performed in the grid. It appears when a cell, header, or the pager is right-clicked.
• Clipboard - Selected rows and cells can be copied from the grid
• Export - Provides the options to Export the grid data to Excel, PDF, and CSV formats.
• RTL support - Provides a full-fledged right-to-left mode which aligns content in the Grid control from right to left.
• Localization - Provides inherent support to localize the UI.

Support

Product support is available for through following mediums.

• Creating incident in Syncfusion Direct-trac support system or Community forum.
• New GitHub issue.
• Ask your query in Stack Overflow with tag syncfusion, ej2.

License

Check the license detail here.

Changelog

Check the changelog here