javascriptjqueryhtmlpapaparse

Uncaught ReferenceError: Papa is not defined. Loaded in from cdn in header


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>
Thanks.


Solution

  • 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.