Динамическое обновление таблицы данных в Thymeleaf

Question

Приложение My Spring Boot использует шаблоны Thymeleaf, чтобы пользователи могли загружать файлы. После загрузки каждый файл проходит несколько этапов обработки (это приложение OCR), и на каждом этапе записываются записи в базу данных для отслеживания хода выполнения.

В настоящее время страницы Thymeleaf достаточно c - один раз пользователь загрузил файл, ему возвращается ссылочный номер. Затем они должны вручную скопировать этот ссылочный номер и использовать его на другой странице для поиска и отображения данных отслеживания. Они должны вручную обновить sh страницу, чтобы обновить результаты.

Мне действительно нужна одна страница Dynami c. Как только пользователь отправляет файл, данные отслеживания автоматически отображаются в таблице, которая динамически обновляется каждую секунду или около того, пока обработка не будет завершена.

Я видел множество примеров, когда JQuery используется для обновления HTML div, и я думаю, что это, вероятно, путь вперед. Но примеры, которые я видел, обычно обновляют div со страницы PHP. Я еще не встречал примеров в контексте Thymeleaf MVC.

Это то, что у меня есть: -

Контроллер: после того, как пользователь загрузил файл, отслеживается информация извлекается из базы данных с помощью JPA и добавляется к модели в списке (statusList): -

Optional<List<OcrStatus>> statusListOptional = ocrStatusRepository.findAllByUrn(urnNumber);
List<OcrStatus> statusList;
if (statusListOptional.get() != null){
    statusList = statusListOptional.get();
    model.addAttribute("statusList", statusList);
}

Шаблон Thymeleaf: -

В шаблоне есть div, который содержит фрагмент: -

<div id="data" th:replace="fragments/ocr-file-details :: ocr-file-details"></div>

Этот фрагмент просто извлекает statusList из модели и отображает данные в стандартной таблице.

Теперь я хотел бы сделать следующее: -

while (the file is still being processed) {
    1. call a url to retrieve the latest status records;
    2. update statusList in the model with 1.;
    3. refresh the "data" div to display 2.;
    4. wait a second and repeat loop;
}

Я видел множество примеров использования JQuery для вызова URL-адреса, но я изо всех сил пытаюсь понять, смогу ли я затем использовать это для действий на шагах 2, 3 и 4. Любое руководство будет очень приветствоваться!

РЕДАКТИРОВАТЬ: Это пример JQuery, который я видел до сих пор: -

<script>
    $(document).ready(function(){
         $("#data").load("load.php");
        setInterval(function() {
            $("#data").load("load.php");
        }, 1000);
    });
 
</script>

Это обновление div с содержимым страницы PHP. Могу ли я использовать эту функцию в качестве шаблона для выполнения перечисленных выше шагов, заменив .load("load.php"), возможно, другой функцией, которая выполняет шаги 1, 2 и 3 из моего списка?