The code samples below allow you to extract and convert spreadsheets between various formats such as TXT, XLS, XLSX, XML, CSV, PDF, HTML in JavaScript & jQuery using ByteScout Cloud API.
You may also check samples of how to work with spreadsheets in pure JavaScript, Java, and PHP using Cloud API.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Cloud API JQuery sample</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="converter.js" type="text/javascript" encoding="UTF-8"></script>
</head>
<body>
<form id="form" enctype="multipart/form-data">
<p>
<label>Copy-paste your API Key for ByteScout Cloud API here</label>
<input type="text" id="apiKey" placeholder="your cloud API Key" value=""/>
<a href="https://secure.bytescout.com/sign_up" target="_blank">no api key yet? sign up here</a>
</p>
<p>
<label>Input PDF File</label>
<input type="file" name="file" id="inputFile" />
</p>
<p>
<label>Convert To</label>
<select id="convertType">
<option value="csv"> CSV </option>
<option value="text"> TXT </option>
<option value="xml"> XML </option>
<option value="xls"> XLS </option>
<option value="xlsx"> XLSX </option>
<option value="html"> HTML </option>
</select>
</p>
<p>
<label>Output As</label>
<select id="outputType">
<option value="link"> URL to output file </option>
<option value="inline"> inline content</option>
</select>
</p>
<button type="button" id="submit">Convert</button> <span id="status"></span>
</form>
<div id="errorBlock">
<h2>Error:</h2>
<h4>Code: <span id="statusCode"></span></h4>
<ul id="errors"></ul>
</div>
<div id="resultBlock">
<h2>Output:</h2>
<a id="result" href="" target="_blank"></a>
<div id="inlineOutput"></div>
</div>
</body>
</html>
$(document).ready(function () {
$("#resultBlock").hide();
$("#errorBlock").hide();
$("#result").attr("href", '').html('');
});
$(document).on("click", "#submit", function () {
$("#resultBlock").hide();
$("#errorBlock").hide();
$("#inlineOutput").text(''); // inline output div
$("#status").text(''); // status div
var apiKey = $("#apiKey").val().trim(); //Get your API key at https://secure.bytescout.com/cloudapi.html
var formData = new FormData($("#form")[0]); // file to upload
var toType = $("#convertType").val(); // output type
var isInline = $("#outputType").val() == "inline"; // if we need output as inline content or link to output file
$("#status").text('requesting presigned url for upload...');
$.ajax({
url: 'https://bytescout.io/v1/file/upload/get-presigned-url?name=test.pdf&contenttype=application/pdf&encrypt=true',
type: 'GET',
headers: {'x-api-key': apiKey}, // passing our api key
success: function (result) {
if (result['error'] === false) {
var presignedUrl = result['presignedUrl']; // reading provided presigned url to put our content into
var accessUrl = result['url']; // reading output url that will indicate uploaded file
$("#status").text('uploading...');
$.ajax({
url: presignedUrl, // no api key is required to upload file
type: 'PUT',
headers: {'content-type': 'application/pdf'}, // setting to pdf type as we are uploading pdf file
data: formData,
processData: false,
success: function (result) {
$("#status").text('converting...');
$.ajax({
url: 'https://bytescout.io/v1/pdf/convert/to/'+toType+'?url='+ presignedUrl + '&encrypt=true&inline=' + isInline,
type: 'POST',
headers: {'x-api-key': apiKey},
success: function (result) {
$("#status").text('done converting.');
// console.log(JSON.stringify(result));
$("#resultBlock").show();
if (isInline)
{
$("#inlineOutput").text(result['body']);
}
else {
$("#result").attr("href", result['url']).html(result['url']);
}
}
});
},
error: function () {
$("#status").text('error');
}
});
}
}
});
});