如何在勾选时删除复选框?
我有一个模板,用来显示物品的列表。每个物品旁边都有一个复选框。我想要实现的是,当选中一个复选框时,可以把对应的物品删除。所以我需要一个按钮,能够在选中复选框后删除这个物品。以下是我的模板。
{% for item in items %}
<tr>
<td><input type="checkbox" name="item" value="{{item.pk}}" checked="checked"></td>
<td>{{item.tiptop_id}}</td><td>{{item.alternative_id}}</td><td>{{item.title}}</td>
<td>{{item.type}}</td><td>{{item.format}}</td>
</tr>
{% endfor %}
我想我可能还需要知道在我的视图中该写些什么。
编辑:
我不太明白为什么还是不能删除。看看我的视图吧。我的编辑订单表单很大。我原以为删除功能可以解决这个问题。不管怎样,看看吧。
def edit_order(request, order_no):
# Alot of code here
if request.method == 'POST':
form = forms.OrderForm(request.POST, instance = order)
if form.is_valid() and save_item is not None:
form.save(True)
request.user.message_set.create(message = "The order has been updated successfully.")
return HttpResponse("<script language=\"javascript\" type=\"text/javascript\">window.opener.location = window.opener.location; window.close();</script>")
if status is not None and contact is not None and save_status is not None and delete_item is not None:
try:
for id in status_items:
item = models.StorageItem.objects.get(pk = id)
delete_item = item
delete_item.delete()
current_status = models.ItemStatusHistory(item = item, contact = contact, status = status,
user = request.user)
current_status.save()
except:
pass
request.user.message_set.create(message = "Status successfully changed for {0} items".format(len(status_items)))
3 个回答
[编辑]: 真正的问题是如何在提交表单时从数据库中删除项目,而不是从HTML表格中移除行。请查看本页上的“简单表单处理示例”Django中的表单提交教程。 [/编辑]
这里有一个示例,你可以把它复制到电脑上的一个.html文件中,然后在网页浏览器中打开。这个示例使用了简单的JavaScript。对于这种情况,我更喜欢使用jQuery,但根据你的使用情况,它可能会比你想要的更复杂。不过,如果你需要做很多客户端编程,我强烈推荐使用jQuery。
注意:我觉得使用parentNode.parentNode.parentNode有点麻烦,但这个示例故意使用了原帖中提到的表格/复选框配置。
最好是给表格的每一行分配一个ID,这样和每个复选框对应,方便访问。
我还添加了一个<input type="button">
,因为原帖中提到需要这个。你可能想考虑给每个复选框分配onclick=
事件,这样用户一点击就能删除项目。不过这只是个人偏好。
<html>
<head>
<script>
function hideCheckedRows() {
var checkboxes = document.getElementsByName("item");
var checkboxes_to_remove = new Array();
var count = 0;
for (var i = 0; i < checkboxes.length; i++) {
if (checkboxes[i].checked == true) {
checkboxes_to_remove[count++] = checkboxes[i];
}
}
for (var i = 0; i < checkboxes_to_remove.length; i++) {
cbx = checkboxes_to_remove[i];
// parentNode.parentNode.parentNode is the <tr>
// parentNode.parentNode is the <td> containing the checkbox
cbx.parentNode.parentNode.parentNode.removeChild(
cbx.parentNode.parentNode);
}
}
</script>
</head>
<body>
<table>
<tr name="table_row">
<td><input type="checkbox" name="item" value="Check1"></td>
<td>Id1</td><td>Alt_Id1</td><td>Title1</td>
<td>Type1</td><td>Format1</td>
</tr>
<tr name="table_row">
<td><input type="checkbox" name="item" value="Check2"></td>
<td>Id2</td><td>Alt_Id2</td><td>Title2</td>
<td>Type2</td><td>Format2</td>
</tr>
<tr name="table_row">
<td><input type="checkbox" name="item" value="Check3"></td>
<td>Id3</td><td>Alt_Id3</td><td>Title3</td>
<td>Type3</td><td>Format3</td>
</tr>
</table>
<input type="button" value="Click to remove checkboxes!"
onclick="hideCheckedRows();"/>
</body>
</html>
编辑:
如果你想从数据库中删除项目,我们需要更多信息。我们需要知道使用的是什么类型的数据库,以及处理提交按钮“POST”的服务器端代码是什么样的。这个示例会在用户的网页浏览器中删除复选框,但对数据库中的内容没有任何影响。
你这样做不对哦 :) 应该创建一个专门用于删除的视图。通过POST或GET请求发送要删除的元素的ID(可以放在网址里),然后从数据库中删除这个元素,最后返回一个不包含已删除元素的列表作为响应。
大概是这样的:
def delete_element(request, id):
el = get_object_or_404(Element, id=id)
if el:
el.delete()
html = render_list(request)
if request.is_ajax():
result = simplejson.dumps({
"html": "html",
}, cls=LazyEncoder)
return HttpResponse(result, mimetype='application/javascript')
def render_list(request):
elements = Element.objects.all()
return render_to_string(template_name, RequestContext(request, {
"element" : elements, })
然后在你的模板中,先用JavaScript调用删除功能的网址,成功后再用数据中的['html']更新你的模板。
你可以问这个人: http://twitter.com/sasklacz,他在写关于Django中ajax的教程,可以给你提供需要的具体代码。
你需要写一个视图,用来获取POST数据,找出哪些复选框被选中了,然后根据ID从数据库中删除对应的项目。
你可能还想把这个视图放在一个装饰器里,这样可以确保用户有权限去删除东西,或者检查登录的用户是否和要删除的项目的拥有者是同一个人,这样做也是可以的。
另外,你也可以使用Django的表单框架来处理一些繁琐的工作。
从数据库中删除对象的具体方法可以在数据库模型的文档中找到。
这些事情并不是特别简单,所以不要在这里等太久才能找到完整的解决方案——赶紧动手吧!