Сохранить HTML-экземпляр после обновления

Question

У меня есть эта HTML-таблица данных, где каждая ячейка таблицы доступна для редактирования.Я могу редактировать значение ячейки, и оно временно сохраняется.Но когда я обновляю страницу, она теряется.Поэтому я попытался сохранить экземпляр html в файле Excel, чтобы в будущем увидеть обновленную ячейку.

Ниже функция показывает мне отредактированное значение в консоли

$(document).ready(function() {
  var table = $('#example').DataTable();
  table.MakeCellsEditable({
    "onUpdate": myCallbackFunction

  });

  function myCallbackFunction(updatedCell, updatedRow, oldValue) {
    console.log("The new value for the cell is: " + updatedCell.data());
    console.log("The old value for that cell was: " + oldValue);
    console.log("The values for each cell in that row are: " + updatedRow.data());
    updatedCell.data();
    updatedRow.data();
    table.draw();
  }
});

И это мой Ajax для вызова функции python:

$("#sa").click(function() {
  $.ajax({
    url: '/save',
    type: 'POST',
    success: function(response) {
      alert('ok')
    }
  })
});

И в основном моя функция python принимаетберет исходный код страницы и сохраняет его в excel.Но дело в том, что моя таблица редактируется, а скрипт сохраняет старые значения.Когда я использую chromes inspect element, я вижу значение обновлений, но когда я вижу его с помощью View source source, я вижу старые значения.

Кто-нибудь может сказать, как я могу взять обновленный источник HTML-страницы и отправить его, используяАякса

Answer 1

Просмотр DataTables Сохранение состояния , это опция в плагине [stateSave: true], который использует localstorage и sessionStorage для сохранения состояния вашей таблицы.

Пример:

$(document).ready(function() {
    $('#example').DataTable( {
        stateSave: true
    } );
} );

Поскольку состояние сохраняется, вы можете просто получать данные каждый раз при перезагрузке страницы.

Answer 2

Основное различие между page source и inspect element:

Источник страницы показывает, какой сервер первоначально ответил, то есть фактический HTML, отправленный с сервера.

Проверка элемента показывает текущее состояние DOM после манипуляции JS.

DOM генерируется с использованием исходного кода всей исходной страницы / HTML.

Вот почему источник вашей страницы всегда будет одинаковым.

Что вы можете сделать, это опубликовать html-содержимое document в своем ajax, чтобы получить последнюю версию источника страницы.

Следующее должно помочь вам получить обновленный источник DOM в виде строки:

document.documentElement.innerHTML

Хотя не уверен, почему вам нужно опубликовать источник, поскольку вы можете только опубликовать обновленные значения и соответственно обновить базу данных.