Django 单击锚定时运行ajax删除记录

我是jquery和ajax新手，但我刚刚学习了如何使用jquery ajax发布表单并保存表单，现在我在模板的表中有了一个记录列表，如下所示：

field1  field2  field3 <a href="#" id="rec1">del</a>
field1  field2  field3 <a href="#" id="rec2">del</a>
field1  field2  field3 <a href="#" id="rec2">del</a>
...

field1  field2  field3 <a href="#" id="rec2" onClick="f({{id}})">del</a>

function deleteAjax(item_id){
$.ajax({
    url: "delete/"+ item_id +"/",
    data: <the id of the record you want to delete>,
    success: function(){
        //here you do the processing needed to remove the row from the html;
    }
});
}

---

我该怎么做呢？

应该是onClick=$this.closest'tr'。删除

假设它是一个实际的表，就像你说的，你有这样的html

<table><tr><td/><td/></tr></table>

---

它类似于onClick=$this.closest'tr'。删除

假设它是一个实际的表，就像你说的，你有这样的html

<table><tr><td/><td/></tr></table>

我试试看

第一：您需要有一个django视图来删除所选项目

第二：在url文件中定义指向该视图的模式，例如

(r'^delete/(\d{4})/$', 'delete_item'),

那么您的javascript应该是这样的：

field1  field2  field3 <a href="#" id="rec1">del</a>
field1  field2  field3 <a href="#" id="rec2">del</a>
field1  field2  field3 <a href="#" id="rec2">del</a>
...

field1  field2  field3 <a href="#" id="rec2" onClick="f({{id}})">del</a>

function deleteAjax(item_id){
$.ajax({
    url: "delete/"+ item_id +"/",
    data: <the id of the record you want to delete>,
    success: function(){
        //here you do the processing needed to remove the row from the html;
    }
});
}

然后，您的html必须更改：

<a id="{{id}}" onclick="deleteAjax({{id}}); return false;"> delete item </a>

click事件将触发javascript deleteAjax并通过向其发送要删除的项的id来调用正确的django视图

只需注意以下几点：

django视图必须处理正确的响应，因为它将确定在其执行结束时调用哪个回调。ajax部分成功：函数…，也可能失败：函数

在“成功”功能中，如果删除成功，则必须记住删除与已删除项对应的表行；如果删除失败，则必须通知

最后：我现在不确定您在ajax函数中发送的数据参数，因为已删除项的id绑定到url。不过，你可以用它来发送你最终需要的任何东西

我会试试看

第一：您需要有一个django视图来删除所选项目

第二：在url文件中定义指向该视图的模式，例如

(r'^delete/(\d{4})/$', 'delete_item'),

那么您的javascript应该是这样的：

field1  field2  field3 <a href="#" id="rec1">del</a>
field1  field2  field3 <a href="#" id="rec2">del</a>
field1  field2  field3 <a href="#" id="rec2">del</a>
...

field1  field2  field3 <a href="#" id="rec2" onClick="f({{id}})">del</a>

function deleteAjax(item_id){
$.ajax({
    url: "delete/"+ item_id +"/",
    data: <the id of the record you want to delete>,
    success: function(){
        //here you do the processing needed to remove the row from the html;
    }
});
}

然后，您的html必须更改：

<a id="{{id}}" onclick="deleteAjax({{id}}); return false;"> delete item </a>

click事件将触发javascript deleteAjax并通过向其发送要删除的项的id来调用正确的django视图

只需注意以下几点：

django视图必须处理正确的响应，因为它将确定在其执行结束时调用哪个回调。ajax部分成功：函数…，也可能失败：函数

在“成功”功能中，如果删除成功，则必须记住删除与已删除项对应的表行；如果删除失败，则必须通知

最后：我现在不确定您在ajax函数中发送的数据参数，因为已删除项的id绑定到url。尽管如此，你还是可以用它来发送你最终需要的任何东西D

tnx，现在听起来我的成功函数不起作用了：

function f(id) {
                $.ajax({
                    url: "/meeting/delParticipant/"+id+"/",
                    type: "POST",
                    data: {'id':id},
                    success: function(res){
                        alert ('success');
                        $(this).closest('tr').remove();
                    }
                });
            };

我将删除表中的行，我使用alert对其进行了测试，我确信不会运行成功

@Samuele成功了！：D

tnx，现在听起来我的成功函数不起作用了：

function f(id) {
                $.ajax({
                    url: "/meeting/delParticipant/"+id+"/",
                    type: "POST",
                    data: {'id':id},
                    success: function(res){
                        alert ('success');
                        $(this).closest('tr').remove();
                    }
                });
            };

---

我将删除表中的行，我使用alert对其进行了测试，我确信不会运行成功

出于好奇：您是否将这些记录保存在数据库中？如果是这样，您将需要一个django视图来删除记录，并使用jquery@Samuele：我编辑了我的问题。只是出于好奇：你是否将这些记录保存在数据库中？如果是这样，您将需要一个django视图来删除记录，并使用jquery@Samuele：我编辑了我的问题。我将使用ajax将其从数据库中删除！您的建议可能是我从数据库中删除记录后的第二个问题。我将使用ajax从数据库中删除它！您的建议可能是我从数据库中删除记录后的第二个问题。如何在视图中使用ajax访问发送的数据？如何在视图中使用ajax访问发送的数据？