Spread.Sheets Documentation
UMD Support
Spread.Sheets Documentation > Developer's Guide > Getting Started > UMD Support

Spread.Sheets supports the UMD (Universal Module Definition) patterns for JavaScript modules that work everywhere.

Typically, the UMD pattern in Spread.Sheets includes support for AMD (Asynchronous Module Dependency) and CommonJS, which are module specifications that enable developers to write code in a modular way. The modular programming done using UMD patterns not only helps in achieving code reusability but also enhances code efficiency while saving considerable amount of time and resources. Besides this, it can help you in providing solutions to some of the common programming problems without any dependency of writing scripts in a certain order while coding in JavaScript.

UMD patterns are supported for the following six javascript files in Spread.Sheets:

  1. gc.spread.sheets.all.xxx.js
  2. gc.spread.sheets.print.xxx.js
  3. gc.spread.sheets.pdf.xxx.js
  4. gc.spread.sheets.charts.xxx.js
  5. gc.spread.sheets.resources.xx.xxx.js
  6. gc.spread.excelio.xxx.js

Using AMD

The AMD (browser-first) dependencies can be asynchronously loaded to avoid a situation where the browser is likely to loose response.

The following code shows how to configure RequireJS, initialize Spread.sheets using AMD and using Excel IO Spread with AMD.

JavaScript
Copy Code

// Configuring RequireJS

<script type="text/javascript">
        requirejs.config({
           "baseUrl": "./lib",
           "paths": {
              "gc-spread-sheets": "gc.spread.sheets.all.11.0.0",
              "gc-spread-excelio": "gc.spread.excelio.11.0.0"
            }
        });
</script>

// Initializing SpreadJS and ExcelIO

    <script type="text/javascript">
        var spread, excelIo, json;
        require(['gc-spread-sheets', 'gc-spread-excelio'], function (gc, excel) {
           spread = new gc.Spread.Sheets.Workbook(document.getElementById("ss"));
           excelIo = new excel.IO();
       });

    function SaveExcel(){
     json = spread.toJSON();
     excelIo.save(json, function (blob) {
           //save blob to excel.
           saveAs(blob, "export.xlsx");
          }, function (e) {
          if (e.errorCode === 1) {
            alert(e.errorMessage);
          }
       });
    }
</script>
       

Using CommonJS

The Common JS (server-first) dependencies makes the javascript code run in the integrated development environment(IDE).

The following code shows how to initialize Spread.Sheets using Common JS.

JavaScript
Copy Code

var gc = require('../lib/gc.spread.sheets.all.x.x.x.min.js');

window.onload = function() {
    var workbook = new gc.Spread.Sheets.Workbook(document.getElementById('ss'));
}

var gc = require('../lib/gc.spread.sheets.all.x.x.x.min.js');
var excel = require('../lib/gc.spread.excelio.x.x.x.min.js');

window.onload = function() {
    var workbook = new gc.Spread.Sheets.Workbook(document.getElementById('ss'));
    var json = JSON.stringify(workbook.toJSON());
    var excelIo = new excel.IO();
    excelIo.save(json, function (blob) {
        //save blod to excel file.
    }, function (e) {
        if (e.errorCode === 1) {
            alert(e.errorMessage);
        }
    });
}