I am fetching data from a database and filling it by adding a manual action button column into Ag-Grid. Now, the first columns consist of those action buttons and 2nd column contains _id I want to hide that second column but in ag-grid documentation they gave information only about hiding column on static data. Here's my code that has column def.
setMasterData (state, payload) {
if (!payload) {
state.tableData.rows = [];
} else {
// First column holds the buttons to delete the row item
let cols = [{
field: '',
headerName: 'Actions',
width: 200,
colId: 'params',
cellRendererFramework: 'gridEditButtons'
}];
cols = cols.concat(Object.keys(payload[0]).map(x => {
return {
field: x,
headerName: x.replace(/([A-Z])/g, ' $1').replace(/^./, function (txt) { return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase(); })
};
}));
state.tableData.cols = cols;
state.tableData.rows = payload;
}
}
How to hide the next column following action column?
...gridColumnApi.setColumnVisible('name of column', false);
一种方法是根据列的名称关闭可见性。
Have this attribute on a column definition whichever column you would like to hide.
hide: true
UPDATE
If the code you've provided of map
works, then you should be able to achieve this like below.
cols = cols.concat(Object.keys(payload[0]).map(x => {
return {
field: x,
hide: x === '_Id', // this will be true when your field == '_Id'
headerName: x.replace(/([A-Z])/g, ' $1').replace(/^./, function (txt) { return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase(); })
};
}));
Condition provided for hide
will be true for _Id
, hence, that column will be hidden.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.