Scroll issue on large spreadsheet (alignment off)
I am experiencing an issue when scrolling my spreadsheet. The sheet has 204 rows, but the last 135 are marked as hidden, leaving on 69 visible. When the user scrolls down (using the keyboard down arrow, or the mouse wheel) the active cell border gets misaligned.
It starts off working correctly, but by row 50 it gets off like this. If the user continues to the bottom, the scrolling stops prematurely at row 66 instead of 69 (the last non-hidden row),
I have attached the json object that I load using openFromJson(). Have I somehow jacked up the json or is this a bug?
Attachment: scrollissue_b21fc792.zip
I have tested version 20.1.58 with mixed results. In some cases the scrolling has been corrected. However I am still running into issues.
I have attached scrollissue3.html (zipped) that demonstrates the remaining issue. To test, open the file and click the SET ROWCOUNT=69 button, then scroll to bottom with down arrow key.
Please note, that the row headers are not displayed here on purpose, so please don't confuse them them the numbers in the first column.
I have noticed that this error can be partially avoided by changing the code below to call appendTo() before setting the visibility of the Ribbon and FormulaBar.
var SS = new ej.spreadsheet.Spreadsheet({
height: 800,
scrollSettings: {
isFinite: true
}
});
SS.showFormulaBar = false; //calling this before appendTo will cause scroll issue
SS.showRibbon = false; //calling this before appendTo will cause scroll issue
SS.appendTo('#SS');
SS.openFromJson({file: data.jsonObject});
Is there a reason why that is? Even with making that change, I occasionally lose functionality of the arrow keys when scrolling around near the bottom.
Attachment: scrollissue3_39e4bc38.zip
Scrolling issues are happening even without using openFromJSon. There's some bugginess still happening.
Strangely, if you set the rowCount on a sheet when the ribbon and formula bar are hidden, the last couple of rows are blank and scroll issues start happening.
My attached example creates a spreadsheet with 200 rows and 40 columns using local data on create.
//create spreadsheet 40x200
var SS = new ej.spreadsheet.Spreadsheet({
height: 800,
showFormulaBar: false, //REMOVE THIS LINE
showRibbon: false, //AND THIS LINE AND IT WORKS
sheets: [{
ranges:[{dataSource: data}],
columns: cols,
colCount: 40,
rowCount: 200
}],
scrollSettings: {isFinite: true}
});
SS.appendTo('#SS');
After the spreadsheet displays, a button click sets the rowCount to 69:
button onclick="SS.sheets[0].rowCount = 69">SET ROWCOUNT=69</button>
If you then scroll to the bottom, rows 68 and 69 are blank. This does NOT happen if the ribbon and formula bars are visible.
Also, if the row headers are not visible, the sheet appears to have only 67 rows instead of 69.
Attachment: scrollissue4_f906c8b3.zip
