JavaScript innerHTML не заполняется - PullRequest
0 голосов
/ 18 ноября 2018

Я пытаюсь заполнить данные данными из запроса к базе данных с помощью Ajax-вызова. Однако раздел, который я пытаюсь заполнить, остается пустым. JS находится в отдельном файле, который импортируется в конце HTML. Вызов функции для заполнения также находится в конце, поэтому я знаю, что проблема не в том, что ID еще не существует.

Вот содержимое моей функции onreadystatechange:

  if (this.readyState == 4 && this.status == 200)
  {
     const data = JSON.parse(this.responseText);

     cards =  "";
     for (x in data)
     {
        cards +=
           " <!-- Story Card -->\n" +
           "<div class=\"card filterDiv State3\" style=\"width: auto;\">\n" +
           "   <div class=\"card-body\">\n" +
           "      <h5 class=\"card-title\">State 3 Card title</h5>\n" +
           "      <h6 class=\"card-subtitle mb-2 text-muted\">Card subtitle</h6>\n" +
           "      <p class=\"card-text\">Some quick example text to build on the card title and make up the bulk of the card's content.</p>\n" +
           "   </div>\n" +
           "</div> <!--End Story Card --> \n"
     }
     console.log(cards);
     document.getElementById("left-col").innerHTML = cards;
  }

Я добавил вызов console.log, чтобы подтвердить, что файл PHP возвращает правильное количество результатов (и удаленное предупреждение подтвердило, что JSON содержит всю правильную информацию и никаких ошибок), и все выводится на печать консоль правильно, но элемент не обновляется. Где это идет:

<div id="left-col">
    <!-- To be populated by cards.js -->
</div>

Та же методика работала для другой области страницы, поэтому я не ожидал никаких проблем с этим. Что мне здесь не хватает?

...