I have a requirement where I need to store a list of objects (each with a unique id) as a session parameter. These objects are then displayed in a table in a JSP using JSTL.
<c:forEach var="list" items="${PlayerList}">
<tr>
<td>
<img style="cursor:pointer" src="./images/delete.jpg" title="Force Delete"
onClick="forceDelete(${list.playerId})">
<td>${list.playerName}</td>
<td>${list.runsScored}</td>
</tr>
</c:forEach>
Additionally, there is an AJAX function that handles the deletion:
<script>
function forceDelete(playerIdValue)
{
var xmlhttp;
var toDelete = confirm("Do you want to Remove?")
if (window.XMLHttpRequest)
{
xmlhttp=new XMLHttpRequest();
}
else
{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById('display_div').innerHTML=xmlhttp.responseText;
}
}
if (toDelete == true)
{
xmlhttp.open("POST","PlayerController?
value="+playerIdValue,true);
xmlhttp.send();
}
}
</script>
The process also involves handling deleting rows in the PlayerController servlet's POST method.
The next step is implementing functionality where users can select multiple checkboxes and delete the selected rows from the JSP using AJAX:
<c:forEach var="list" items="${PlayerList}">
<tr>
<td><input type="checkbox">
<td>${list.playerName}</td>
<td>${list.runsScored}</td>
</tr>
</c:forEach>
<input type="button" value="delete">
Once checkboxes are selected, pressing the delete button will trigger the respective rows' deletion through AJAX.
If any additional information is required for assistance, please let me know.
Thank you.
I've attempted to implement this feature but it doesn't seem to be working. Can you help me identify where I may be going wrong?
Checkbox code `
<input type="checkbox" name="toBeDeleted[]" value="${list.playerId}">
<div align="center"><button onclick="forceStop()">Delete</button></div>
JavaScript code
function forceStop()
{
var toBeDeleted = new Array();
$("input:checked").each(function() {
data['toBeDeleted[]'].push($(this).val());
});
$.ajax({
url:"PlayerController",
type:"POST",
dataType:'json',
data: {toBeDeleted:toBeDeleted},
success:function(data){
},
});
`