0

I want to fill an array with data I'm fetching from a MySQL database. On initial load the array is empty. How do I populate the array with the fetch data initially. I want to continue to use that array data for other things. I'm very new at javascript. Any help would be welcomed.

  <html>
  <head> </head>

 <body>
 <div class="container-lg p-5">
  <table class="table table-striped align-left one-line-text">
    <thead>
      <tr>
        <th>ID</th>
        <th>Title</th>
        <th>Track</th>
        <th>Series</th>
        <th>Date</th>
        <th>Day</th>
        <th>File Name</th>
      </tr>
    </thead>

    <tbody id="table">
      <!-- Content -->
    </tbody>
  </table>
</div>

   <script>
var allTrackFiles = []

fetch("files/get.php")
  .then((res) => res.json())
  .then((data) => (allTrackFiles = data))

loadList()

//---------------------------------------
function loadList() {
  const table = document.getElementById("table")
  for (var i = 0; i < allTrackFiles.length; i++) {
    var obj = allTrackFiles[i]
    var row = table.insertRow(i)

    for (var key in obj) {
      var value = obj[key]
      if (key != "file_src") {
        row.insertCell().innerHTML = value
      } else {
        row.insertCell().innerHTML =
          "<a href='../tracks/" + value + "'>" + value + "</a>"
      }
    }
  }
    }
  </script>
TheManOfSteell
  • 105
  • 9
  • `.then((data) => loadList(data))` and have `function loadList(allTrackFiles) {` – mplungjan Aug 15 '23 at 06:59
  • Also play with template literals: `document.getElementById("table").innerHTML = allTrackFiles.map(item => Object.entries(item).map(([key,val]) => \`${key === 'file_src' ? \`${val}\` : val }\`).join("")).join("")` – mplungjan Aug 15 '23 at 07:03

0 Answers0