jspreadsheet
Scroll down and Lazy Loading problem
Hi, I have a problem with the scroll. It always shows the same rows (i.e. 21-59). If I scroll down to the end of the scroll bar, with the mouse wheel, it loads the next rows (they are visible for a few milliseconds) but immediately shows again the rows 21-59.
I think it might be a problem related to the tableHeight property and the number of visible rows. If I assign a value up to 700px (32 visible rows) it scrolls fine, but if I assign a value of 750px or higher (34 visible rows) it fails.
CTRL+END, CTRL+HOME or holding the mouse button down and scrolling down works fine, but if you use the mouse wheel to scroll it fails.
I'm using the latest version available in npm (4.11.1) but with version 4.10.1 it also happened.
This is my spread configuration:
spreadSheet = jspreadsheet(document.getElementById('dataManager'), { csv: url, csvHeaders: true, columns: columns, defaultColWidth: 150, tableOverflow: true, tableWidth: '100%', tableHeight: '849px', // From approximately 750px upwards it fails about: false, allowDeleteColumn: false, allowRenameColumn: false, allowInsertColumn: false, search: true, lazyLoading: true, loadingSpin: true, allowExport: true, includeHeadersOnDownload: true, filters: true, onchange: changed, onafterchanges: afterChanges, onundo: undoed, onredo: redoed, ondeleterow: deleterow, toolbar: toolbar, editable: true });
It is a similar problem to the issue [https://github.com/jspreadsheet/ce/issues/1267]
Regards
Hi,
Could you create a jsfiddle who reproduct your problem ?
Thanks
Hi, I don't know how to upload a csv file with hundreds of records to JSFiddle, but I've tried to create this Fiddle but it doesn't work Fiddle
You can use this CSV file : https://bossanova.uk/jspreadsheet/arts.csv
Hi GBonnaire, I have added the link to the csv file and changed columns definition, but when I run the Fiddle I always get the error:
"65:14 Uncaught SyntaxError: Invalid destructuring assignment target" Regards
I fork your project, fix error on your columns and add data (from CSV)
https://jsfiddle.net/guillaumebonnaire/Lskdb9at/1/
Hi @GBonnaire, thanks for your help.
With that example I'm unable to reproduce the problem. Could be a problem when jSpreadSheet need to read the csv file? Regards
Hi,
Here : https://bossanova.uk/jspreadsheet/v4/examples/import-data
It's JSS with CSV file, can you reproduct here ?
Otherwise, the problem is not in JSS but a component around JSS (like CSS or other JS component)
Hi, I've removed all css, with the exception of jspreadsheet.css and jsuites.css, and I've tested the load lazing process in two different physical screens. One screen with 1920x1080 size, and second screen with 1920x1200 size. 30 rows in first screen are visible and 35 in second screen.
Result... first screen works fine when scrolling down, but the second screen attempts to scroll but always displays from row 30 onwards (30-64). For a few milliseconds you can see the correct rows, but immediately returns to row 30.
I've tried with different sets of data (csv file, json file, etc.) and different columns definitions with the same results.
In your configuration JSS, do you have tableHeight in % or in vh ?
How much lines in your CSS file ?
I search to understand, because, i don't see why specifics 35 lines throw an error on scroll. The JSS CE is based to load 100 lines, on different test i can't reproduct this error. On Jsfiddle, i can't.
I think you have something who change behavior JSS. It's possible you have a component who change height line or who have a scroll control (in global).
Sorry, but i can't help you more. If you can reproduct this problem on JSFiddle, CodePen or directly on Jspreadsheet CE, we can help. Otherwise, try Pro version, the lazyloading and scroll is better
Hi jlgarcia-vs,
I haved similar problem, look link below https://github.com/jspreadsheet/ce/issues/1554
