根据复选框选择（AJAX）删除JSP中的多行数据

Question

我正在满足以下要求。

我将对象列表（每个对象都有唯一的ID）作为会话参数存储，并使用JSTL在jsp的表中显示每个对象数据，如下所示

<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>

而AJAX功能是

   <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>

我正在处理PlayerController Servlet的POST方法中的删除行

现在我想实现如下

<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">

用户可以选择多个复选框并单击删除按钮，然后应使用AJAX从JSP中删除相应的行

我该如何进行，任何帮助将不胜感激。

如果需要任何其他数据，我准备提供。

提前致谢。

我尝试了这个，但似乎没有用，告诉我我做错了什么。

复选框代码`

<input type="checkbox" name="toBeDeleted[]" value="${list.playerId}">
<div align="center"><button onclick="forceStop()">Delete</button></div>

JS代码

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){
            },
            });

`

Answer 1

在没有确切代码详细信息的情况下需要遵循的方法：

1. 为您的复选框提供名称和值属性，值是玩家的ID
2. 单击删除后，将获得所有复选框的列表，这将为您提供一个值数组，即玩家ID数组
3. 该数组需要通过ajax请求传递给您的servlet，该servlet检索列表并删除所有记录。

如有任何疑问，还将张贴伪代码。

Answer 2

这就是我所做的，并且工作正常

在JSP中，JS函数内部

function forceStop()
        {

            var checkboxes = document.getElementsByName('toBeDeleted');
            var selected = new Array();
            for (var i=0; i<checkboxes.length; i++) {
                if (checkboxes[i].checked) {
                    selected.push(checkboxes[i].value);
                }
            }

                $.ajax({
                    url:"PlayerController",
                    type:"POST",
                    dataType:'json',
                    data: {toDelete:selected},
                    success:function(data){
                      alert("SUCCESS");
                    },
                });

        }

在servlet内部，我检索了如下数组。

String[] toDelete = request.getParameterValues("toDelete[]");
    int[] toBeDeleted=new int[toDelete.length];
    for(int i=0;i<toDelete.length;i++)
    {
        toBeDeleted[i]=Integer.parseInt(toDelete[i]);
    }

我们需要将每个元素解析为整数，因为它们将被AJAX解析为字符串。

从控制器我做了批量删除使用DAO。