Not strong in thymeleaf. On the page for editing, I go through the list of phones and display information on the type of phone and number. For the phone type, the possibility of choosing from the previously entered types (mobile, work, etc.) is implemented. How to make it so that in the absence of data on the phone fields were added, in which you can enter data?

<p th:each="phone,stat:${person.getPhoneNumbers()}"> Телефон: <input type="text" th:name="phoneNumbers[__${stat.index}__].type" th:list="phoneTypes" th:value="${phone.getType()}" > <datalist id="phoneTypes"> <option th:each="phoneType:${phoneTypes}" th:value="${phoneType}" th:text="${phoneType}"></option> </datalist> Номер: <input type="text" th:name="phoneNumbers[__${stat.index}__].number" th:value="${phone.getNumber()}" > </p>

    1 answer 1

    Fields can be added after checking for data

     <div th:if="${not #lists.isEmpty(phone)}"> <p th:each="phone,stat:${person.getPhoneNumbers()}"> Телефон: <input type="text" th:name="phoneNumbers[__${stat.index}__].type" th:list="phoneTypes" th:value="${phone.getType()}" > <datalist id="phoneTypes"> <option th:each="phoneType:${phoneTypes}" th:value="${phoneType}" th:text="${phoneType}"></option> </datalist> Номер: <input type="text" th:name="phoneNumbers[__${stat.index}__].number" th:value="${phone.getNumber()}" > </p> </div> <div th:unless="${not #lists.isEmpty(phone)}"> Телефон: <input type="text" th:name="phoneNumbers[0].type" th:list="phoneTypes"> <datalist id="phoneTypes"> <option th:each="phoneType:${phoneTypes}" th:value="${phoneType}" th:text="${phoneType}"></option> </datalist> Номер: <input type="text" th:name="phoneNumbers[0].number"> </div>