Propagate object in thymeleaf form

Question

I have a page with two forms, and want to add object from first form when submitting second one. Basically it looks like this: First form:

<form action="#" method="POST" enctype="multipart/form-data" th:action="@{/foo}" th:object="${prop1}" id="form1">
    <input type="file" name="file" class="form-control"/>
    <input type="text" th:value="${prop1.taskSheetName}" name="taskSheetName"/>
    <input type="number" th:value="${prop1.descriptionColumnPosition}" name="descriptionColumnPosition"/>
</form>

Second form:

<form th:if="${resourceId}" action="#" method=" th:object="${prop2}" id="prop2" th:action="@{/foo/{id}(id=${resourceId})}">
    <input type="url" th:value="${prop2.url}" name="url"/>
    <input type="text" th:value="${prop2.username}" name="username"/>
    <input type="password" th:value="${prop2.password}" name="password"/>
</form>

And controller methods:

@RequestMapping(value = "/foo", method = POST)
public String uploadFile(@RequestParam("file") MultipartFile file, final ExcelProperties properties, final Model model) {
    //some logic here
}

@RequestMapping(value = "/process/{id}", method = POST)
public String processResource(@PathVariable("id") String id, final Prop2 prop2, final Prop1 prop1, final Model model) {
}

And I need to pass the values from first form values to second method with second form values, but it passes empty form object. I tried to add

<div th:with="p1=${prop1}">

since I know that this data is present in page, but it didn't help.
If this even possible or should I just give up and write custom submit handler in javascript?

Answer 1

According to MDN, it's impossible to attach 1 input into 2 forms,

You need to do some work with JavaScript.