Posted 19 July 2019, 5:19 pm EST - Updated 3 October 2022, 7:50 pm EST
I am trying to add multiple column headers to my PDF outputs. On Using the code below, I almost accomplished what I wanted, but it leaves an empty row no matter what I do.
My ultimate goal is the top header image on every page that requires the column headers. It’s only an issue when I have large datasets, and there are multiple pages. The numbers are present in the itemSource as the first row[0].
I guess another way to ask this question, would be how do you remove a row from the grid.row array, and add it to the grid.columnheader.row array. And if I do this, how would I apply a style to the new row to center align them like they are before the move.
Another thing I have to work around is the PDF component adds the default grey number and letter headers, and I have to remove those before I can continue. Perhaps that messes with things but I do not want them there in my final pdf output. The first few lines of the code below removes them.
const desiredSheetGrid = new wjcGrid.FlexGrid(wijmo.createElement('<div></div>'), {
itemsSource: this.workbookData.WorkSheets[index]
});
const colCnt = grid.rowHeaders.columns.length;
grid.rowHeaders.columns.removeAt(colCnt - 1);
// remove the extra line number at the end of the sheets
grid.columns.splice(grid.columns.length - 1, 1);
const newRow = new wjcGrid.Row();
newRow.dataItem = desiredSheetGrid.rows[0].dataItem;
const secondRowHeader = Object.keys(desiredSheetGrid.columnHeaders.rows[0].collectionView.currentItem);
const existingRow = new wjcGrid.Row();
existingRow.dataItem = JSON.parse(JSON.stringify(newRow.dataItem));
let i = 0;
for (const [key, value] of Object.entries(existingRow.dataItem)) {
existingRow.dataItem[key] = secondRowHeader[i];
i++;
}
desiredSheetGrid.columnHeaders.rows.splice(0, 1);
desiredSheetGrid.columnHeaders.rows.push(existingRow);
desiredSheetGrid.columnHeaders.rows.push(newRow);
desiredSheetGrid.itemsSource.splice(0, 1);
desiredSheetGrid.rows.splice(0, 1);
(desiredSheetGrid.collectionView as wijmo.CollectionView).remove(desiredSheetGrid.rows[1].dataItem);
// just trying stuff, thinking the row is removed but not refreshed?
desiredSheetGrid.invalidate(true);
desiredSheetGrid.refresh(true);