Отправка двух действий из одной формы HTML
Функция getCheckedTasks реализует множественный выбор задач с помощью чекбоксов. Я хочу чтобы в зависимости от нажатой кнопки, данные о выбранных тасках, полученные с помощью getCheckedTasks отправлялись, на разные url.
<form th:action="@{'/tasksJournal/'+${id}+'/swapTasks'}" method="post">
<select name="journal">
<option value="0">select journal</option>
<option data-th-each="journal: ${journals}" th:text="${journal.getJournalName()}" th:value="${journal.getId().toString()}"></option>
</select>
<button style="width: 57.5px; margin-right: 2px; float:left" type="submit" class="btn btn-outline-dark" >send</button>
</form>
<form onsubmit="return false;">
<table id="tasks"
border="1" cellspacing="5" cellpadding="10">
<tr>
<td></td>
<td><b>Title</b></td>
<!-- <td><b>Actions</b></td>-->
</tr>
<tr data-th-each="task : ${tasks}">
<td><input type="checkbox" th:id="${task.getId().toString()}" name="task_checkbox"></td>
<td > <a th:href="@{'/tasksJournal/'+${journalId}+'/updateTask/'+ ${task.getId().toString()}}" data-th-text="${task.getTitle()}"> </a></td>
</tr>
</table>
<section>
<h1></h1>
</section>
<div>
<script th:inline="javascript">
function getCheckedTasks(str1,journal_id,str2) {
if(!window.confirm('Do you really want to delete selected tasks?'))
return false;
let result = new Array();
let rows = new Array();
let checkboxes = document.getElementsByName("task_checkbox");
let size = checkboxes.length;
for(let i = 0; i < size; ++i){
if(checkboxes[i].checked === true){
let currentId = checkboxes.item(i).getAttribute("id");
result.push(currentId);
rows.push(checkboxes.item(i).parentNode.parentNode)
}
}
let parent = rows[0].parentNode;
let resultStr = result[0];
for(let i = 1; i< result.length; ++i){
resultStr = resultStr.concat(',',result[i]);
}
let rowsCount = rows.length;
for(let i = 0; i < rowsCount; ++i){
parent.removeChild(rows[i]);
}
let xhr = new XMLHttpRequest();
let endpoint = str1+ journal_id + str2;
xhr.open("POST", endpoint);
xhr.send(resultStr);
}
</script>
<button value="Delete" style="float:left; margin-right: 2px" th:onclick="getCheckedTasks('/tasksJournal/', [[${journalId}]], '/deleteTasks/')"/>
Delete Tasks</button>
</div>
</form>
То есть если нажимаем на кнопку "send", данные должны отправиться в:
th:action="@{'/tasksJournal/'+${id}+'/swapTasks'}"
Если на кнопочку "Delete Tasks", то в:
'/tasksJournal/' + [[${journalId}]] + '/deleteTasks/'