Обновление содержимого страницы cURL и ajax без обновления страницы

Question

У меня есть форма для отправки запроса ajax, который возвращает объект json из запроса cURL.Я использую форму для запроса API, используя даты начала и окончания.Мне удалось показать данные, возвращенные в таблицу.Теперь моя проблема заключается в том, что каждый раз при создании нового запроса из моей формы новая страница отображается на странице формы сразу после таблицы, которую я получил с помощью предыдущего запроса, есть ли способ показать только одну таблицу, поэтому на каждой формезапросить замену прежних данных новыми данными?

Это мой код JavaScript

**$(document).ready(function() {
  // Function to create table layout
  function createTable(data) {
    var table = document.createElement('table');
    var header = table.insertRow();
    for(var h in data[0]) {
      var th = document.createElement('th');
      th.innerHTML = h;
      header.appendChild(th);
    }
    table.classList.add('table','table-bordered');
    data.forEach(function(item) {
      var row = table.insertRow();
      for(var v in item) {
        var cell = row.insertCell();
        if (Array.isArray(item[v])) {
          var subtable = createTable(item[v]);
          cell.appendChild(subtable);
        }
        else {
          cell.innerHTML = item[v];
        }
      }
    })
    return table;
  }
  // Initialize air datepicker plugin
  $('.air-datepicker').datepicker();
  // Store form into variable
  var form= $("#requestForm");
  // Actions when form is submitted
  $('#submitForm').click(function(e) {
    // Ajax request
    $.ajax({
      type: "POST",
      url: form.attr("action"),
      data: form.serialize(),

      success: function(result){
        // Show the table container
        $('#tableContainer').css('display','block');
        // Convert reponse into JSON
        datas = JSON.parse(result);
        // Get nome condominio and show it
        $('#nome_condominio').html(datas.condomini[0].condominio.nome);
        // Get indirizzo condomino and show it
        $('#indirizzo_condominio').html(datas.condomini[0].condominio.indirizzo);
        // Put datas into table using the function createTable
        var table = createTable(datas.condomini[0].ricevute);
        // Show table 
        $('#table').append(table);
        console.log(result);
      },
      error: function(error, status, xhr) {
        console.log(error, status, xhr);

      }
    }); // Fine ajax

   e.preventDefault(); // Prevent form to be sent
  }); // fine submit form

}); // fine document ready**

Answer 1

С

// Show table
$('#table').html(table);

Вы заменяете html-содержимое узла DOM #table вместо добавления новой таблицы к существующему содержимому (включая предыдущие сгенерированные таблицы).

Теперь, если#table должен быть пустым во время вызова, тогда это решение подойдет.

В противном случае, если присутствует какой-либо контент (например, заголовок таблицы), он стирается, и вам придется искать способвосстановить его.