Excel Import and Export

SpreadJS supports the import and export to Excel files using the following mentioned ways:

Import and Export Excel on client side
Import and Export with SJS file formats
Import and Export Encrypted Excel Files

Import and Export on Client Side

You can import an Excel file (.xlsx) to JSON and export a JSON object to Excel with the import and export methods on the client side.

The exported Excel file is locked since the file is from the Internet. The Excel export occurs client-side, not from the server. Hence, downloading on the client side causes the file to be locked. When you open the Excel file for the first time, it displays a warning message.

You must include <!DOCTYPE html> to view the widget properly and the reference file gc.spread.excelio.*.*.*.min.js to import and export Excel files.

You can download the Excel file locally or get the returned Excel file (type: blob) to post it to a server.

Using Code

This example opens and saves an Excel file. Note that the first section of the code lists the dependencies for the client-side import and export.

<!DOCTYPE html>
<html lang="en">
<head>
    <title>SpreadJS Client Side ExcelIO</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2023-11-29/FileSaver.min.js"></script>
    <link href="./css/gc.spread.sheets.excel2013white.x.x.x.css" rel="stylesheet"/>
    <script src="./scripts/gc.spread.sheets.all.x.x.x.min.js" type="application/javascript"></script>
    <!--For client-side excel i/o-->
    <script src="./scripts/interop/gc.spread.excelio.x.x.x.min.js"></script>
</head>
<body>
<div>
    <input type="file" name="files[]" id="fileDemo" accept=".xlsx"/>
    <input type="button" id="loadExcel" value="Import" onclick="ImportFile()"/>   
    <input type="button" class="btn btn-default" id="saveExcel" value="Export" onclick="ExportFile()"/>
<input type="text" id="exportFileName" placeholder="Export file name" class="form-control" value="export.xlsx"/>
    <div id="ss" style="width:100%; height:500px"></div>
</div>
</div>
</body>
<script>
    var workbook, excelIO;
window.onload = function () {
workbook = new GC.Spread.Sheets.Workbook(document.getElementById("ss"));
excelIO = new GC.Spread.Excel.IO();
    }
    function ImportFile() {
        var excelFile = document.getElementById("fileDemo").files[0];
        excelIO.open(excelFile, function (json) {
            var workbookObj = json;
           workbook.fromJSON(workbookObj);
        }, function (e) {
            console.log(e);
        });
    }
    function ExportFile() {
        var fileName = document.getElementById("exportFileName").value;
        if (fileName.substr(-5, 5) !== '.xlsx') {
            fileName += '.xlsx';
        }
        var json = JSON.stringify(workbook.toJSON());
        excelIO.save(json, function (blob) {
            saveAs(blob, fileName);
        }, function (e) {
            console.log(e);
        });
    }
</script>
</html>

Import and Export with SJS File Formats

You can import Excel files (.xlsx) to .SJS (SpreadJS filetype) and export .SJS files to Excel using the open and save methods. With .SJS format, the imported file can significantly improve the load time and memory usage when working with very large Excel files. It will also reduce the file size significantly when resaving.

This example opens and saves an Excel file using open and save methods.

// Open the SJS file to spread.
function OpenFile() 
{ 
var excelFile = document.getElementById("fileDemo").files[0]; 
spread.open(excelFile, () => { 
}, function (e) { 
    console.log(e); 
});  
} 

// Export spread to xlsx file.
function SaveFile()
{ 
var fileName = document.getElementById("exportFileName").value; 
if (fileName.substr(-5, 5) !== '.xlsx') 
{ fileName += '.xlsx'; } 
spread.save(sjs, function (blob)  {
    saveAs(blob, fileName);
}, function (e) { 
    console.log(e);
});
}

The following table lists the features that are imported or exported from or to an Excel file.

Category	Description	Import (excel to JSON)	Export (JSON to excel)
workbook(spread)	tabstrip: tabStripVisible, startSheetIndex, tabStripRatio, tabColor	√	√
	scrollbar: showHorizontalScrollbar, showVerticalScrollbar	√	√
	sheets: sheet visible, sheet name	√	√
	Reference style: R1C1 or A1	√	√
	custom name	√	√
sharedStrings	the string used for sheet data (common string, string with white spaces)	√	√
theme	color scheme	√	√
	font scheme (SpreadJS has no detailed fonts)	√	√
	format scheme (SpreadJS has no format schemes)	X	√
style	cellStyles: all SpreadJS supported styles	√	√
	different formats (formats used in tables, conditional formats, and filters)	√	√
	tableStyles	√	√
worksheet	rowRangeGroup, colRangeGroup	√	√
	rowCount and columnCount	√	√
	showZeros	√	√
	gridline visible, gridline color	√	√
	row header and column header visible	√	√
	zoom	√	√
	selections	√	√
	activeRow, activeColumn	√	√
	freeze (frozenRowCount, frozenColumnCount)	√	√
	default rowHeight, default columnWidth	√	√
	columnInfo: column width, column visible, column style	√	√
	merged cells (span)	√	√
	protected sheet	√	√
	rowInfo: row height, row visible, row style	√	√
	cellInfo: cell value, cell formula, cell style	√	√
	custom name	√	√
	conditional format	√	√
	comment	√	√
	picture	√	√
	slicer	√	√
	sparkline	√	√
	table	√	√
	filter	√	√
	validation	√	√
	outline	√	√
	print	√	√

Import and Export Encrypted Excel Files

You can import and export encrypted Excel files by adding the following IO reference in your application.

<script src="scripts/gc.spread.sheets.io.0.0.0.min.js"></script>

Import Encrypted Excel File

To import a password-protected Excel file, you need to pass the password property in the spread's import method. If the correct password is provided, the file gets imported successfully. However, if an invalid or incorrect password is provided, the errorCallBack function is triggered, which returns an error. Using the members of the ErrorCode enumeration, you can specify the error message.

The following code sample shows how to import an encrypted Excel file:

const userPassword = 'Asdf0123';   
// Import an Excel file with a password.    
const errorCallback = (e) => {
    if (e.errorCode = GC.Spread.Sheets.IO.errorCode.invalidPassword) {
        console.log('Invalid Password!');
    } else if (e.errorCode = GC.Spread.Sheets.IO.errorCode.noPassword) {
        console.log('Please enter the password!');
    }
}
spread.import(file, () => { }, errorCallback, {
    fileType: GC.Spread.Sheets.FileType.excel,
    password: userPassword, 
})

Export Encrypted Excel File

You can export a password-protected Excel file by specifying the password property of the spread's export method. In this case, SpreadJS exports the encrypted Excel file if the password is entered, else it exports the original Excel file without encryption.

The following code sample shows how to export an encrypted Excel file:

const userPassword = 'ABC0123';
const fileName = 'encrypt-export.xlsx';
// Export an Excel file with a password.
spread.export(blob => saveAs(blob, fileName), e => console.log(e),
    {
    fileType: GC.Spread.Sheets.FileType.excel,
    password: userPassword,
    }
);

Using Designer

You can also provide the password while importing or exporting a protected Excel file in SpreadJS Designer.

To import an encrypted Excel file, click File and then choose Import. On the Import menu page, choose Excel File, specify the settings for importing your file, enter the password in the Password box, and then click Import Excel File.

ImportEncryptedExcel

To export an encrypted Excel file, click File, then choose Export. On the Export menu page, choose Excel File, specify the settings for exporting, enter the password in the Password box, and then click Export Excel File.

ExportEncryptedExcel