How to convert spreadsheets (Excel, CSV, TXT, XML, HTML, PDF) in JavaScript using Cloud API - ByteScout

How to convert spreadsheets (Excel, CSV, TXT, XML, HTML, PDF) in JavaScript using Cloud API

  • Home
  • /
  • Articles
  • /
  • How to convert spreadsheets (Excel, CSV, TXT, XML, HTML, PDF) in JavaScript using Cloud API

With ByteScout Cloud API you can easily extract and convert spreadsheets between various formats such as TXT, XLS, XLSX, XML, CSV, PDF, HTML.

Below you will find an example of how to work with spreadsheets in JavaScript using Cloud API.

You may also work with spreadsheets in Java, jQuery and PHP using Cloud API.

Sample.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Spreadsheet Cloud API Example</title>
    <script src="spreadsheet.js" type="text/javascript" encoding="UTF-8"></script>
</head>
<body>

    <form id="form1" enctype="multipart/form-data">
        <p>
            <label>Copy-paste your API Key for api.pdf.co here</label>
            <input type="text" id="apiKey" placeholder="API Key"/>
        </p>
        <p>
            <label>InputFile</label>
            <input type="file" name="file" id="inputFile"/>
        </p>
        <p>
            <label>Convert To</label>
            <select id="targetFormat">
                <option value="CSV">CSV</option>
                <option value="HTML">HTML</option>
                <option value="TXT">TXT</option>
                <option value="XLS">XLS</option>
                <option value="XLSX">XLSX</option>
                <option value="XML">XML</option>
                <option value="PDF">PDF</option>
            </select>
        </p>
        <button type="button" id="submit" onclick="return onSubmit()">Convert</button>
    </form>

    <div id="errorBlock" style="visibility: hidden">
        <h2>Error:</h2>
        <h4>Code: <span id="statusCode"></span></h4>
        <div id="errors"></div>
    </div>

    <div id="resultBlock" style="visibility: hidden">
        <h2>Result:</h2>
        <a id="result" href=""></a>
    </div>

</body>
</html>

spreadsheet.js

function onSubmit() {
    // Hide result blocks
    document.getElementById("errorBlock").style.display = "none";
    document.getElementById("resultBlock").style.display = "none";

    // Get API Key
    var apiKey = document.getElementById("apiKey").value.trim();
    if (apiKey == null || apiKey == "") {
        alert("API Key should not be empty.");
        return false;
    }

    // UPLOAD FILE

    var url = "https://api.pdf.co/api/v1/file/upload?apiKey=" + apiKey; // Get your API key by registering at http://www.api.pdf.co
    var formData = new FormData(document.getElementById("form1"));

    var httpRequest = new XMLHttpRequest();
    httpRequest.open("POST", url, true);

    // Handle asynchronous response
    httpRequest.onreadystatechange = function () {
        if (httpRequest.readyState == 4) {
            // If OK
            if (httpRequest.status == 200) {
                var uploadedFileId = httpRequest.responseText;
                ConvertSpreadsheet(apiKey, uploadedFileId);
            }
            // Else display error
            else {
                document.getElementById("errorBlock").style.display = "block"; // show hidden errorBlock
                // Display error
                document.getElementById("statusCode").innerHTML = httpRequest.status + " - " + httpRequest.statusText;
                document.getElementById("errors").innerHTML = httpRequest.responseText;
            }
        }
    }

    httpRequest.send(formData);

    return true;
}

function ConvertSpreadsheet(apiKey, uploadedFileId) {
    var url = "https://api.pdf.co/api/v1/spreadsheet/convert?apiKey=" + apiKey; // Get your API key by registering at http://www.api.pdf.co

    var targetFormat = document.getElementById("targetFormat").value;

    var options = {
        "properties": {
            "convertType": targetFormat,
            "createNavigationLinks": true,
            "autoSize": false
        },
        "input": uploadedFileId,
        "inputType": "FileId",
        "outputType": "link"
    };

    // Prepare request
    var httpRequest = new XMLHttpRequest();
    httpRequest.open("POST", url, true);
    httpRequest.setRequestHeader("Content-Type", "application/json");
    // Handle asynchronous response
    httpRequest.onreadystatechange = function () {
        if (httpRequest.readyState == 4) {
            // If OK
            if (httpRequest.status == 200) {
                var resultFileLink = httpRequest.responseText;
                document.getElementById("resultBlock").style.display = "block"; // show hidden resultBlock
                var a = document.getElementById("result");
                a.setAttribute("href", resultFileLink);
                a.innerHTML = resultFileLink;
            }
            // Else display error
            else {
                document.getElementById("errorBlock").style.display = "block"; // show hidden errorBlock
                // Display error
                document.getElementById("statusCode").innerHTML = httpRequest.status + " - " + httpRequest.statusText;
                document.getElementById("errors").innerHTML = httpRequest.responseText;
            }
        }
    }
    // Send request
    httpRequest.send(JSON.stringify(options));
}

Tutorials:

prev
next