ag-grid setRowData重新设置表格行数据,如果我们想通过自己定义的ajax方法更新行数据(会清除原因数据),这时就需要用到setRowData方法。
//重新设置表格数据**************************************
function reset() {
gridOptions.api.setRowData([{ id: 1, name: 'it小书童', url: 'www.itxst.com', catalog: '软件' }]);
}
//定义列
var columnDefs = [
{ headerName: '', checkboxSelection: true, headerCheckboxSelection: true, width: 50, 'pinned': 'left' },
{
headerName: '网站名称', field: 'name', filter: 'agTextColumnFilter', 'pinned': 'left', width: 100,
},
{ headerName: '网址', field: 'url' },
{ headerName: '行业', field: 'catalog', filter: 'agNumberColumnFilter' }
];
//表格数据
var rowData = [
{ id: 1, name: '网易', url: 'www.163.com', catalog: '门户' },
{ id: 2, name: 'QQ', url: 'www.qq.com', catalog: 'IM' },
{ id: 3, name: '微软', url: 'www.microsoft.com', catalog: '软件' }
];
//aggrid设置
var gridOptions = {
columnDefs: columnDefs,
rowData: rowData,
rowSelection: 'multiple',
rowMultiSelectWithClick: true,
suppressCellSelection: true
};
//在dom加载完成后 初始化agGrid完成
document.addEventListener("DOMContentLoaded", function () {
var eGridDiv = document.querySelector('#myGrid');
agGrid = new agGrid.Grid(eGridDiv, gridOptions);
});