Basic example
Use pinned: 'left'
to pin column to the left side of the table.
<div id="grid"></div>
import { DataDen } from "data-den-core";
const rows = [
{ car: 'Honda', model: 'Civic', year: '01/05/2013', price: 28000 },
{ car: 'Mitsubishi', model: 'Lancer', year: '01/05/2013', price: 56000 },
{ car: 'Porsche', model: 'Boxster', year: '09/02/2020', price: 31000 },
{ car: 'Toyota', model: 'Celica', year: '16/12/2010', price: 18000 },
{ car: 'Kia', model: 'Sportage', year: '14/09/2006', price: 28000 },
{ car: 'Ford', model: 'Focus', year: '04/07/2014', price: 24000 },
{ car: 'Ford', model: 'Focus', year: '16/12/2010', price: 24000 },
{ car: 'Porsche', model: 'Boxster', year: '24/01/2015', price: 31000 },
{ car: 'Mitsubishi', model: 'Lancer', year: '14/09/2006', price: 18000 },
{ car: 'Kia', model: 'Sportage', year: '01/05/2013', price: 24000 },
];
const options = {
columns: [
{
field: "car",
headerName: "Car",
pinned: 'left'
},
{
field: "model",
headerName: "Model",
},
{
field: "year",
headerName: "Year",
},
{
field: "price",
headerName: "Price",
},
],
rows: rows,
};
const gridEl = document.getElementById('grid');
const dataDen = new DataDen(gridEl, options);