Basic Initialization
ag-Grid is a fully-featured and highly customizable JavaScript data grid. It delivers outstanding performance, has no 3rd party dependencies and integrates smoothly.
1. Initialize the plugin by referencing the necessary files:
<script src="ag-grid/ag-grid-community.min.noStyle.js"></script>
<link rel="stylesheet" type="text/css" href="ag-grid/ag-grid.css">
Note! Add Ag Grid themes css files as per requirements.
2. Call the DataTable-function after the page has loaded
/*** GRID OPTIONS ***/
var gridOptions = {
columnDefs: columnDefs,
rowSelection: "multiple",
floatingFilter: true,
filter: true,
pagination: true,
paginationPageSize: 20,
pivotPanelShow: "always",
colResizeDefault: "shift",
animateRows: true,
resizable: true
};
/*** DEFINED TABLE VARIABLE ***/
var gridTable = document.getElementById("myGrid");
/*** INIT TABLE ***/
new agGrid.Grid(gridTable, gridOptions);
Refer following links for detailed documentation, configuration options, methods and examples:
Type | URL |
---|---|
Plugin Link | https://www.ag-grid.com/ |