Below is the HTML. I load in the cdn hosted lib for PapaParse in the header. But when I run my JavaScript file and it runs the function where I call Papa.unparse(data);
It throws an error saying that Papa is not defined. So
I am a bit confused on what the exact issue here is because I clearly have loaded it into the html and before my JavaScript scripts are loaded as well.
Help is much appreciated.
Edit: I have fixed the issue. The problem was the cdn itself. I assume the links are broken or the file is not on their server. It may also be that specific version, I suspect this is most likely the cause. Tested same version with cdnjs still does not work. Weird.
<script src="https://fastcdn.org/Papa-Parse/4.1.2/papaparse.min.js"></script>
This version and cdn seems to work. Thanks!
function makeThatExcelFilePapa(data, title) {
var csv = Papa.unparse(data);
return csv;
}
// Make sure the DOM is loaded before trying to add listeners
window.onload = function () {
// Set dropdown list for Brand to be empty on start
document.getElementById("dealerSearchForm").elements["brand"].selectedIndex = -1;
// Call submit method when submit button is clicked
var submitButton = this.document.getElementById("submitButton");
$(submitButton).on('click', getFormData);
$(exportToExcel).on('click', callJSONConverter);
}
var items;
function callJSONConverter() {
//JSONToCSVConvertor(JSON.stringify(items), "Results for " + dealerName, true);
makeThatExcelFilePapa(items, "Results for " + dealerName);
return false;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Dealer Tab</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jsgrid/1.5.3/jsgrid.min.css" />
<link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jsgrid/1.5.3/jsgrid-theme.min.css" />
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jsgrid/1.5.3/jsgrid.min.js"></script>
<script type="test/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/PapaParse/4.6.0/papaparse.min.js"></script>
<link rel="stylesheet" href='cnh_dealer_tab.css'>
</head>
<body>
<div class="form-style">
<h3>Find Dealer:</h3>
<form id="dealerSearchForm" method="POST" action="cnh_dealer_tab.html">
Brand:
<select name="Brand" id="brand" required>
<option value="NHAG">NHAG</option>
<option value="NHCE">NHCE</option>
<option value="CSCE">CSCE</option>
<option value="CSAG">CSAG</option>
</select>
<div id="goRight">
SAP Code:
<input type="text" id="sapCode" name="SAPCode" required>
</div>
<br>
<br> Dealer:
<input type="text" id="dealer" value="" readonly>
<br>
<br>
<button id="submitButton">Submit</button>
<input type="reset" name="reset">
<button id="goToCountyTab">Go to County Tab</button>
<button id="exportToExcel">Export to Excel</button>
</form>
</div>
<div id="jsGrid" class="form-style">
<span class="grid">
<script type="text/javascript" src='cnh_grid_data'></script>
<script type="text/javascript" src='cnh_ssm_assignments'></script>
</span>
</div>
</body>
</html>
Try doing:
$(document).ready(function() {
function makeThatExcelFilePapa(data, title) {
var csv = Papa.unparse(data);
return csv;
}
});
And, as others have pointed out, don't load the Papa library twice.