ag-Grid Simple Example

<html>
<head>
    <script src="https://unpkg.com/ag-grid/dist/ag-grid.js"></script>
    <script src="example-js.js"></script>
</head>
<body>
    <div id="myGrid" style="height: 100%;" class="ag-fresh"></div>
</body>
</html>

var columnDefs = [
    {headerName: "Name", field: "name", editable: true, cellEditor: 'popupText'},
    {headerName: "Price1", field: "price1", editable: true, cellEditor: 'popupText'},
    {headerName: "Price2", field: "price2", editable: true, cellEditor: 'popupText'}
];

var totalRow = {name: "Total", price1: 6000, price2: 139000};

var rowData = [
    {name: "Toyota", price1: 1000, price2: 35000},
    {name: "Ford", price1: 2000, price2: 32000},
    {name: "Porsche", price1: 3000, price2: 72000}
];

var gridOptions = {
    columnDefs: columnDefs,
    rowData: rowData,
    floatingBottomRowData: [totalRow],
};

document.addEventListener("DOMContentLoaded", function() {

    var eGridDiv = document.querySelector('#myGrid');

    new agGrid.Grid(eGridDiv, gridOptions);
});