Breaking News: Grepper is joining You.com. Read the official announcement!

ag-grid header text-align: center

Charming Crayfish answered on March 8, 2022 Popularity 8/10 Helpfulness 3/10

answer ag-grid header text-align: center

related ag-grid header text-align: center

ag-grid header text-align: center

Comment

const columnDefs = [
  { field: 'athlete', headerTooltip: "The athlete's name" },
  { field: 'age', headerTooltip: 'The athlete`s age' },
  { field: 'country' },
  { field: 'year',cellStyle: { 'text-align': "right" }, },
  { field: 'date', headerTooltip: 'The date of the Olympics' },
  { field: 'sport', headerTooltip: 'The sport the medal was for' },
  { field: 'gold', headerTooltip: 'How many gold medals' },
  { field: 'silver', headerTooltip: 'How many silver medals' },
  { field: 'bronze', headerTooltip: 'How many bronze medals' },
  { field: 'total', headerTooltip: 'The total number of medals' },
];

const gridOptions = {
  columnDefs: columnDefs,
  defaultColDef: {
    width: 150,
  },
  tooltipShowDelay: 500,
};

// setup the grid after the page has finished loading
document.addEventListener('DOMContentLoaded', () => {
  const gridDiv = document.querySelector('#myGrid');
  new agGrid.Grid(gridDiv, gridOptions);

  fetch('https://www.ag-grid.com/example-assets/olympic-winners.json')
    .then((response) => response.json())
    .then((data) => gridOptions.api.setRowData(data));
});

Popularity 8/10 Helpfulness 3/10 Language whatever

Source: www.ag-grid.com

Tags: ag-grid center header whatever

Link to this answer
Share Copy Link

Contributed on Mar 08 2022

Charming Crayfish

0 Answers Avg Quality 2/10

Closely Related Answers

ag-grid header text-align: center

Comment

const columnDefs = [
  { field: 'athlete', headerTooltip: "The athlete's name" },
  { field: 'age', headerTooltip: 'The athlete`s age' },
  { field: 'country' },
  { field: 'year', cellStyle: { 'text-align': "right" }, },
  { field: 'date', headerTooltip: 'The date of the Olympics' },
  { field: 'sport', headerTooltip: 'The sport the medal was for' },
  { field: 'gold', headerTooltip: 'How many gold medals' },
  { field: 'silver', headerTooltip: 'How many silver medals' },
  { field: 'bronze', headerTooltip: 'How many bronze medals' },
  { field: 'total', headerTooltip: 'The total number of medals' },
];

const gridOptions = {
  columnDefs: columnDefs,
  defaultColDef: {
    width: 150,
  },
  tooltipShowDelay: 500,
};

// setup the grid after the page has finished loading
document.addEventListener('DOMContentLoaded', () => {
  const gridDiv = document.querySelector('#myGrid');
  new agGrid.Grid(gridDiv, gridOptions);

  fetch('https://www.ag-grid.com/example-assets/olympic-winners.json')
    .then((response) => response.json())
    .then((data) => gridOptions.api.setRowData(data));
});

Popularity 8/10 Helpfulness 4/10 Language whatever

Source: www.ag-grid.com

Tags: ag-grid

Link to this answer
Share Copy Link

Contributed on Mar 08 2022

Charming Crayfish

0 Answers Avg Quality 2/10

ag-grid header text-align: center

Contents

More Related Answers

ag-grid header text-align: center

Closely Related Answers

ag-grid header text-align: center

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.