ajax实现删除功能

JSP页面:

用来显示数据:
<c:forEach var="news" items="${newsList}" varStatus="status">
<tr <c:if test="${status.count%2==0}"> class="bianse"</c:if>>
<td>${news.id}</td>
<td>${news.title}</td>
<td>${news.summary}</td>
<td>${news.author}</td>
<td><fmt:formatDate value="${news.createdate}" pattern="yyyy年MM月dd日 HH时mm分ss秒"/></td>
<td>
   <a href="${pageContext.request.contextPath}/news/lookcomment?newsid=${news.id}&currentPageNo=${currentPageNo}&title=${title}">查看评论</a> &ensp;
   <a href="${pageContext.request.contextPath}/news/addcomment?newsid=${news.id}&currentPageNo=${currentPageNo}&title=${title}">评论</a>&ensp;
   <a class="delNews" href="javascript:;" newsid=${news.id }>删除</a>
</td>
</tr>
</c:forEach>
用来显示删除的结果:
<p STYLE="text-align:center"><span id="tishi"></span></p>

controller:

@RequestMapping(value="/delNews",method=RequestMethod.POST)
@ResponseBody
public Object delNews(@RequestParam String id) {
    logger.debug("———————————————————————————id:"+id);
    int i =newsService.deleteNews(Integer.parseInt(id));
    logger.debug("———————————————————————————i:"+i);
    if(i!=1){
        return "false";
    }
    return "true";
}

ajax:

jQuery(document).ready(function() {
    $(".delNews").click(function(){
        var s = $("#tishi");//用来显示删除的结果
        var id=$(".delNews").attr("newsid");//获取newsid属性的值
        var a=confirm("是否删除次新闻以及回复!!!");
        var t = $(this).parent().parent();当前对象的父类的父类
        if(a==true){
            $.ajax({
                type:"POST",
                url:"/news/delNews",
                data:{"id":id},
                dataType:"json",
                success:function(data){
                    if(data == "true"){//删除成功:移除删除行
                        s.html("删除成功");
                        t.remove();//删除之后要将这个内容remove掉
                    }else{//删除失败
                        s.html("删除失败");
                    };
                },
            });
        }
    })
})
  • 1
    点赞
  • 19
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
好的,我可以帮你解答这个问题。 要实现datatable发送ajax删除和添加功能,你需要进行以下步骤: 1. 在datatable的初始化中,设置删除和添加按钮的相关参数,例如按钮的class、id等。 2. 编写ajax请求的代码,用于向后端发送删除或添加数据的请求。 3. 在删除或添加按钮的点击事件中,调用ajax请求的代码,并传递相应的参数。 以下是一个简单的示例代码: ``` // 初始化datatable var table = $('#example').DataTable({ // 设置删除和添加按钮的class和id columnDefs: [{ targets: [4], data: null, defaultContent: "<button class='btn btn-danger btn-sm delete-btn' id='delete-btn'>删除</button><button class='btn btn-success btn-sm add-btn' id='add-btn'>添加</button>" }] }); // 删除按钮点击事件 $('#example tbody').on('click', '.delete-btn', function () { var data = table.row($(this).parents('tr')).data(); // 发送ajax请求 $.ajax({ url: '/delete', type: 'POST', data: {id: data[0]}, success: function () { // 删除成功后,重新加载datatable table.ajax.reload(); } }); }); // 添加按钮点击事件 $('#add-btn').click(function () { // 获取添加数据的表单数据 var formData = $('#add-form').serialize(); // 发送ajax请求 $.ajax({ url: '/add', type: 'POST', data: formData, success: function () { // 添加成功后,重新加载datatable table.ajax.reload(); } }); }); ``` 在上述代码中,我们首先在datatable的初始化中设置了删除和添加按钮的class和id。然后,在删除和添加按钮的点击事件中,分别调用了发送ajax请求的代码,并传递相应的参数。最后,当删除或添加成功后,重新加载了datatable。 需要注意的是,具体的ajax请求的参数和返回值需要根据你的后端代码进行相应的调整。
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值