Issue
I am trying to use a variable in my HTML file called "Description", that I defined like this:
<h1 th:text="'Product ' + ${item.itemCode}"></h1>
<div class="inset">
<p>
<label>Item Code</label>
<b th:text= "${item.itemCode}"></b>
<p>
<p>
<label>Item Description</label>
<b th:text= "${item.Description}" contenteditable="true" name="Description" id="Description"></b>
<p>
<p>
<label>Item Price</label>
<b th:text= "${item.Price}" contenteditable="true" name="price" id="price"></b>
<p>
<p>
<label>Item Creation Date</label>
<b th:text= "${item.creationDate}" contenteditable="true" name="date" id="date"></b>
<p>
<p>
<label>Item Creator</label>
<b th:text= "${item.creatorUser}" contenteditable="true" name="creator" id="creator"></b>
<p>
<p>
<label>Item State</label>
<b th:text= "${item.itemEnum.getEstado()}"></b>
<p>
<p>
<a th:href="@{/api/item/saveChanges(itemCode = ${item.itemCode}, description = getVariable())}"> <input name="submit" type="submit" value="Save Changes" /></a>
</p>
<p th:if="${item.itemEnum.getEstado() == 'Active'}">
<a th:href="@{/api/item/changeInactive/{itemCode}(itemCode = ${item.itemCode})}"> <input name="submit" type="submit" value="Deactivate" width="100%"/></a>
</p>
<p th:if="${item.itemEnum.getEstado() == 'No Active'}">
<a th:href="@{/api/item/changeActive/{itemCode}(itemCode = ${item.itemCode})}"> <input name="submit" type="submit" value="Activate" width="100%" /></a>
</p>
</div>
<script>
function getVariable(){
return document.getElementById("Description");
}
</script>
Basically, I get that variable from my controller. However, it is editable. What I want is to be able to get the current value of "Description" so I can send it back to the controller to update it, something like this:
<a th:href="@{/api/item/saveChanges(description = ${Description})
Solution
You can use it something like this:
<textarea rows="7" cols="10" th:text= "${item.Description}" name="Description" >
Receive it in the controller, if the user updates it, you will get an updated value.
Answered By - Adarsh Gupta