How to fix my table to print out multiple lines of data?

November 17, 2023

I am currently having problems with displaying a table within my bootstrap modal. Below is where the table is being drawn:

function setHistory(info){
  
  document.getElementById("view_info_table").innerHTML = "";
  $(".view_info").removeClass("hide");
  if(info == undefined || info == null){
    return;
  }
  
  let string = "";
  if(info.length > 0){
    string = "<tr>" +
                "<th>Meeting Subject</th>" +
                "<th>Meeting ID</th>" +
              "<tr>";
    $("#view_info_table").removeClass("hide");
  } else {
    $('#view_info_table').addClass("hide");
  }
  for(let i = 0; i < info.length; i++){
    string = "<tr>" +
                "<td>" + info[i]['meetingsubject'] + "</td>" +
                "<td>" + info[i]['meetingid'] + "</td>" +
              "</tr>";
  }
  document.getElementById("view_info_table").innerHTML = string;
}

Currently the data will only show one line of data but should show at list four for the data I manual put in. What part of my code am I missing or what can be fixed that will allow multiple lines of data to be shown?

>Solution :

The reason you are only getting one line of code is because of this one section within it:

for(let i = 0; i < info.length; i++){
    string += "<tr>" +
                "<td>" + info[i]['meetingsubject'] + "</td>" +
                "<td>" + info[i]['meetingid'] + "</td>" +
              "</tr>";
  }

As seen above you should add a ‘+’ before your equal sign. This will allow the for statement to be ran multiple times instead of a single time.