Javascript Variable isnt useable

Question

Does anyone know, why I can't access the variable csvData at the last line? Its just empty and I don't know why. Do you guys have any clue?

$(document).ready(function() {
  $(".item").click(function(event) {
    $("#" + event.target.id).fadeOut("fast");
  });
});
$.ajax({
  url: 'data.csv',
  dataType: 'text',
}).done(successFunction);
var csvData = "";

function successFunction(data) {
  csvData = Papa.parse(data);
  csvData = csvData.data;
  csvData.forEach(generateTableCards);
  csvData.forEach(generateTableItems);
}

var tables = [];
var i = 0;

function generateTableCards(item) {
  if (!tables.includes(item[5]) && i != 0 && item[5] != undefined) {
    tables.push(item[5]);
    $("#card_wrapper").append(`
          <div class="card" id="card_${item[0]}">
            <h4 id="table_${item[0]}">${item[5]}</h4>
            <div class="tableitems_${item[0]}">

            </div>
          </div>
        `);
  }
  i = i + 1;
}

console.log(csvData);

It's empty because by the time the interpreter hits the last line `console.log(csvData)`, the ajax request from above isn't finished and `successFunction` hasn't been called. — digitalbreed, Sep 06 '22 at 10:44
If you add the console.log(csvData) inside the successFunction does it have data? — Simeon, Sep 06 '22 at 10:48

Javascript Variable isnt useable

0 Answers0