Javascript 更改属性未在thymeleaf中初始化

我对集成到thymeleaf模板中的javascript有以下问题。 下表列出了不同的输入字段，这些字段中填充了来自模型的数据。 此外，对于每个输入字段，我都有一个隐藏的附加输入字段。 这个想法是，当我更改NotHiddenInput标记时，隐藏的标记将接收新值

                        <tr th:each=" item : ${products}">
                            <td>
                                <input class="form-control" type="text" th:value="${item.product.name}" id="productName" name="productName" />
                            </td>
                            <td>
                                <input class="form-control" type="text" th:value="${{item.product.price}}" id="productPrice" name="productPrice" />
                            </td>
                            <td>
                                 <input class="form-control" type="text" th:onchange="substituteOnClick()" th:value="${item.quantity}" id="quantityItem" name="quantityItem" />
                            </td>
                            <td>
                                <input class="form-control" type="text" th:value="${item.MinQuantity}" th:onchange="substituteOnClick()" id="minquantityItem" name="minquantityItem" />
                            </td>

                            <td>
                                <form th:action="@{/deleteWarehouseItem/{id_del}/(id_del=${item.id})}" method="post" role="form" class="ui form">
                                <button type="submit" class="ui form" name = "itemDel" th:value="${item.id}">Löschen</button>
                                </form>
                            </td>
                            <td>
                            <form class="ui form" method="post" th:action="@{/updateItem}" >
                                <input type="hidden" name="productName_mvc" id="productName_mvc" value="0" th:value="${item.product.name}"/>
                                <input type="hidden" name="productPrice_mvc" id="productPrice_mvc" value="0" th:value="${{item.product.price}}"/>
                                <input type="hidden" name="quantityItem_mvc" id="quantityItem_mvc" value="0" th:value="${item.quantity}"/>
                                <input name="minquantityItem_mvc" id="minquantityItem_mvc" value="0" />
                                <input type="hidden" name="inventoryIdentifier_mvc" id="inventoryIdentifier_mvc" th:value="${item.id}"/>
                                <button type="submit" class="ui labeled icon button" name = "updateItem" th:text="#{management.updateItem}">


                                </button>
                            </form>
                            </td>

                        </tr>

正如您所看到的，我的问题是，对于每一行，我需要两个按钮来执行不同的操作，因为我决定只更改隐藏输入的值是有用的。这是可能的，因为只有当我需要更新一个对象并且它主要发生在变更事件时，我才使用隐藏输入。但我的问题是，即使我在非隐藏输入中写入任何新内容，它也不会影响我隐藏的输入。我没有把他们中的一个藏起来。 如何通过先在其他输入中更改值来更改其他输入中的值。

---

最美好的祝愿

首先，您需要从此行中删除这些额外的括号

 <input class="form-control" type="text" th:value="${{item.product.price}}" id="productPrice" name="productPrice" />

如果您没有获得这些值，请为每个输入或所有输入添加一个按钮，而不是onchange事件，在表单中使用一个按钮，然后使用onClick函数或onsubmit，如下所示：

   <form onsubmit="return substituteOnClick()">
   <td>
       <input class="form-control" type="text" th:value="${item.product.name}" id="productName" name="productName" />
   </td>
   <td>
        <input class="form-control" type="text" th:value="${item.product.price}" id="productPrice" name="productPrice" />
    </td>
    <td>
        <input class="form-control" type="text"  th:value="${item.quantity}" id="quantityItem" name="quantityItem" />
     </td>
     <td>
          <input class="form-control" type="text" th:value="${item.MinQuantity}" id="minquantityItem" name="minquantityItem" />
     </td>
<input type="submit" name="Submit" value="Submit"/>
</form>

如果有帮助，请告诉我

console.log("In js function");
console.log(qI);

   <form onsubmit="return substituteOnClick()">
   <td>
       <input class="form-control" type="text" th:value="${item.product.name}" id="productName" name="productName" />
   </td>
   <td>
        <input class="form-control" type="text" th:value="${item.product.price}" id="productPrice" name="productPrice" />
    </td>
    <td>
        <input class="form-control" type="text"  th:value="${item.quantity}" id="quantityItem" name="quantityItem" />
     </td>
     <td>
          <input class="form-control" type="text" th:value="${item.MinQuantity}" id="minquantityItem" name="minquantityItem" />
     </td>
<input type="submit" name="Submit" value="Submit"/>
</form>