Convert Excel to PDF in JQuery - Async API - JavaScript
PDF from XLS or CSV sample in JavaScript demonstrating ‘Convert Excel to PDF in JQuery - Async API’
converter.js
var apiKey, formData, toType, isInline;
$(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
apiKey = $("#apiKey").val().trim(); //Get your API key at https://app.pdf.co
formData = $("#form input[type=file]")[0].files[0]; // file to upload
toType = $("#convertType").val(); // output type
isInline = $("#outputType").val() == "inline"; // if we need output as inline content or link to output file
$("#status").html('Requesting presigned url for upload... <img src="ajax-loader.gif" />');
$.ajax({
url: `https://api.pdf.co/v1/file/upload/get-presigned-url?name=test.${$("#inputFile").val().split('.').pop().toLowerCase()}&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").html('Uploading... <img src="ajax-loader.gif" />');
$.ajax({
url: presignedUrl, // no api key is required to upload file
type: 'PUT',
data: formData,
processData: false,
success: function (result) {
$("#status").html('Processing... <img src="ajax-loader.gif" />');
$.ajax({
url: 'https://api.pdf.co/v1/xls/convert/to/' + toType,
type: 'POST',
headers: { 'x-api-key': apiKey, "Content-Type": "application/json" },
data: JSON.stringify({
"url": accessUrl,
encrypt: true,
inline: isInline,
async: true
}),
success: function (result) {
if (result.error) {
$("#status").text('Error uploading file.');
}
else {
checkIfJobIsCompleted(result.jobId, result.url);
}
}
});
},
error: function () {
$("#status").text('error');
}
});
}
}
});
});
function checkIfJobIsCompleted(jobId, resultFileUrl) {
$.ajax({
url: 'https://api.pdf.co/v1/job/check?jobid=' + jobId,
type: 'GET',
headers: { 'x-api-key': apiKey }, // passing our api key
success: function (jobResult) {
$("#status").html(jobResult.status + ' <img src="ajax-loader.gif" />');
if (jobResult.status == "working") {
// Check again after 3 seconds
setTimeout(function(){checkIfJobIsCompleted(jobId, resultFileUrl)}, 3000)
}
else if (jobResult.status == "success") {
$("#status").text('Done converting.');
$("#resultBlock").show();
if (isInline && toType != "pdf") {
$.ajax({
url: resultFileUrl,
dataType: 'text',
success: function (respText) {
$("#inlineOutput").text(respText);
}
});
}
else {
$("#result").attr("href", resultFileUrl).html(resultFileUrl);
}
}
}
});
}
sample.html
<!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="" /> No API Key yet? Sign up
<a href="https://apidocs.pdf.co" target="_blank">here</a>.
</p>
<p>
<label>Input Excel File (*.xls, *.xlsx)</label>
<input type="file" name="file" id="inputFile" />
</p>
<p>
<label>Convert To</label>
<select id="convertType">
<option value="csv">CSV</option>
<option value="json">JSON</option>
<option value="html">HTML</option>
<option selected="selected" value="pdf">PDF</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>
PDF.co Web API: the Web API with a set of tools for documents manipulation, data conversion, data extraction, splitting and merging of documents. Includes image recognition, built-in OCR, barcode generation and barcode decoders to decode bar codes from scans, pictures and pdf.
Download Source Code (.zip)
return to the previous page explore PDF from XLS or CSV endpoint
Copyright © 2016 - 2024 PDF.co