Reputation:
A table shows a list of records, and each has a accept reject button.
When reject is clicked, a javascript prompt appears , to type in reject reason.
The reject reason + record ID needs to be sent over to the controller.
<script>
<!-- prompt a box to type in reject reason -->
function rejectPrompt() {
var txt;
var rejectMsg = prompt("Please enter your Reject message:", " ");
document.getElementById("rejectMsg").innerHTML = rejectMsg;
}
</script>
/*table to show record accept-reject button*/
<td>
<form action="#" data-th-action="@{/accountantApplication}" method="post">
<input type="hidden" name="id" th:value="${acc.id}" />
<input type="hidden" id="rejectMsg" name="rejectMsg" th:value="${acc.id}" />
<button type="submit" name="action" value="Accept">Accept</button>
<button type="submit" name="action" onclick="rejectPrompt()" value="Reject">Reject</button>
</form>
</td>
@PostMapping(value="/accountantApplication", params="action=Reject")
public ModelAndView Reject(@RequestParam String id,@RequestParam String rejectMsg) {
ModelAndView modelAndView = new ModelAndView();
System.out.println("rejectMsg:"+rejectMsg);
System.out.println("id:"+id);
accountantService.rejectAccountant(id);
modelAndView.setViewName("RejectAccountant");
return modelAndView;
}
Issue is , the reject message does not reach the controller . Only the correct ID is sent over. How do i send id and message across?
Or if there is a better way to implement it , do advice. Thanks so much!
Upvotes: 0
Views: 1249
Reputation: 1778
Setting document.getElementById("rejectMsg").innerHTML = rejectMsg
is like the HTML:
<input type="hidden" id="rejectMsg" name="rejectMsg" value="someAccId">Some rejectMsg</input>
In order to have "Some rejectMsg"
sent to the server you'll have to set the value
of the <input>
:
document.getElementById("rejectMsg").value = rejectMsg
Note that this will override the effect th:value="${acc.id}"
in the <input id="rejectMsg">
Upvotes: 2