Developing a spreadsheet editor for the ULM Project to make it easier to edit a massive excel spreadsheet containing product data without the need for excel. The goal was to make it simple but not to recreate the entire excel app. The project continued to create a realtime report generation app which you can Click Here to check it out!
The table was created using completely custom UI, HTML5, PHP, SQL PDO, and Javascript. I designed the table to make data entry easier for editing large portions of data and added pagination and sql optimizations to improve the performance.
I created a css class that would style the table and a Javascript library for the functionality of the table. In the code review example I show that I am taking advantage of angular to create a simple HTML table. The css and Javascript will customize the look and functionality of the table.
The app has features such as in cell editing and update callbacks. The update callback will update the SQL table in realtime using a simple PHP script and PDO to update the SQL table. When a cell is edited the master dataset is also updated as well to provide a cached copy of the data to easily load into the report.
Pagination is used to improve performance when loading the data from the SQL database. I update the cached version every call to the SQL database and load data into the table from the cached version of the table.
The PDF reports were generated using the PDF.js library. I had to build a template first using simple lines and text fields. The template would be passed the dataset which would contain the columns and cell data. The data would be loaded into the template and rendered using PDF.js and an HTML renderer for complicated shapes.