я есть структура данных, как это: -

WorkHistory{
    List<Jobs> jobs;
}
Jobs{
   List<String> workDoneSentences;
}

По сути, я пытаюсь собрать все прошлые работы, где человек работал, и работу, которую он там делал. Так что это список структуры списка. Я хотел бы знать, как мы можем справиться с этим в пользовательском интерфейсе для Thymeleaf / Spring MVC.

Я пытаюсь создать пользовательский интерфейс, как показано на изображениях. Есть таблица для ввода данных. Чтобы войти в workDoneSentence, я хотел бы открыть другой модал. И список предложений должен быть привязан к правильному индексу работы.

Work Done открывает модальное поле для ввода списка предложений о проделанной работе.

HTML-код, который я имею для этого следующим образом: -

                                            <tbody>
                                            <tr id='addr_work0' th:each="workRow, rowStat : *{workHistoryDetails.allWorkHistoryData}">
                                                <td th:text="${rowStat.index + 1}"></td>
                                                <td><input type="text" name='work_name0'
                                                    placeholder='Company Name'  class="form-control" th:field="*{workHistoryDetails.allWorkHistoryData[__${rowStat.index}__].companyName}"/></td>
                                                <td><input type="text" name='work_city0'
                                                    placeholder='Company city' class="form-control" th:field="*{workHistoryDetails.allWorkHistoryData[__${rowStat.index}__].city}"/></td>
                                                <td><input type="text" name='work_title0'
                                                    placeholder='Job Title' class="form-control" th:field="*{workHistoryDetails.allWorkHistoryData[__${rowStat.index}__].jobTitle}"/></td>
                                                <td><input name="is_current0" type="checkbox"
                                                    value="" class="form-control" style="text-align: center;" th:field="*{workHistoryDetails.allWorkHistoryData[__${rowStat.index}__].currentJob}">
                                                </td>
                                                <td><input type="text" name='work_start0'
                                                    placeholder='Start Date' class="form-control" th:field="*{workHistoryDetails.allWorkHistoryData[__${rowStat.index}__].startDate}"/></td>
                                                <td><input type="text" name='work_end0'
                                                    placeholder='End Date' class="form-control" th:field="*{workHistoryDetails.allWorkHistoryData[__${rowStat.index}__].endDate}"/></td>
                                                <td><a class="btn btn-primary btn-md" id="work_done0"
                                                    name="work_done0">Work done</a></td>


                                            </tr>
                                            <tr id='addr_work1'></tr>
                                        </tbody>

Я не уверен, как я могу связать вход WorkDone. Пожалуйста, предложите. Спасибо!