Create web UI application for editing of XLSX document in HTML5 web browser

VintaSoft Imaging .NET SDK 12.2 complemented with VintaSoft Office .NET Plug-in provides the functionality for visual editing of an existing XLSX document in web application.

For editing XLSX documents was created a web editor of XLSX documents. The web editor of XLSX documents consists from two parts.

The first part of XLSX document web editor is a JavaScript UI control WebSpreadsheetDocumentEditorControlJS, which is written on pure JavaScript code and can be used in any modern HTML5 web browser (Chrome, Firefox, Edge, Opera, Safari). This control performs 4 main functions:

1. Displays UI for XLSX editor.
2. Sends requests to web service to obtain information about XLSX document and for editing XLSX document.
3. Gets answers from web service and displays XLSX document in web browser.
4. Provides the ability to edit an XLSX document in web browse using keyboard and mouse.

WebSpreadsheetDocumentEditorControlJS control allows to:

• Load and existing XLSX document.
• Display worksheets of XLSX document.
• Display the list of worksheets in the document, add/rename/move/delete sheet.
• Select/resize/add/remove rows/columns on worksheet.
• Navigate by cells of worksheet using mouse and keyboard.
• Select cells on worksheet using mouse and keyboard.
• Change the style properties (font, filling, borders, number format, text style, alignment, indent, etc) of selected cells.
• Display formatted and localized text of cell.
• Calculate the cell formula value.
• Edit a cell text directly in the cell region or in the formula line.
• Search for text in the document.
• Download the edited spreadsheet document.

The second part of XLSX document web editor is a web service VintasoftOfficeWebService, which serves requests from WebSpreadsheetDocumentEditorControlJS, control, provides information about the XLSX document and performs editing of XLSX document on server side.

It is possible to run a quick test and assess the work of XLSX document web editor using the free online demo application SpreadsheetEditorDemo: https://demos.vintasoft.com/AspNetCoreSpreadsheetEditorDemo/
Here is a screenshot of SpreadsheetEditorDemo application for ASP.NET Core:


If you are interested in the functionality of SpreadsheetEditorDemo and you want to start testing the SpreadsheetEditorDemo application on your computer - VintaSoft Imaging .NET SDK v12.2 evaluation setup package contains source codes of SpreadsheetEditorDemo project for ASP.NET Core, ASP.NET Core with Angular, ASP.NET MVC5, ASP.NET WebForms.

If it is necessary to add the XLSX document web editor into a new ASP.NET application then it worth to read manuals, which describe how to add the XLSX document web editor into projects for popular ASP.NET development environments:

• Add web spreadsheet document editor to an ASP.NET Core application
• Add web spreadsheet document editor to an ASP.NET Core application with React.js
• Add web spreadsheet document editor to an ASP.NET Core application with Angular
• Add web spreadsheet document editor to an ASP.NET MVC5 application
• Add web spreadsheet document editor to an ASP.NET WebForms application

UI interface of XLSX document web editor can be customized and adjusted for any task. UI interface of XLSX document web editor by default is in English language, but it can be translated to any other language. More detailed information about possible settings of XLSX document web editor please read in the product documentation here: https://www.vintasoft.com/docs/vsimaging-dotnet-web/Programming-Imaging_Web-Spreadsheet_Document_Editor_Control.html

We continuously improve and extend the features of our products. Perhaps at the time of reading this article, the functionality of the XLSX document web editor has already greatly improved and expanded.
If you would like to suggest any improvements to the XLSX Document Web Editor or you have a question about the usage of the XLSX Document Web Editor, please contact us by email support@vintasoft.com.