[英]How to delete a checkbox when it is ticked?
我有一個顯示項目列表的模板。 每個項目都有一個復選框。 我希望能夠在選中復選框時從復選框中刪除項目。 因此,我需要一個按鈕,用於在選中復選框后刪除項目。 這是我的模板。
{% 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)))
您需要編寫一個獲取POST數據的視圖,找出已選中哪些復選框,然后從數據庫中刪除ID匹配的項目。
您可能還希望將視圖包裝在裝飾器中,以確保用戶有權刪除內容,或者如果要這樣做,請檢查登錄用戶是否與要刪除的項目的所有者相同。 。
或者,您可以使用Django的表單框架來處理一些繁重的工作。
從數據庫中刪除對象在db模型文檔中。
這些事情並不完全是瑣碎的,所以不要在這里等待太長時間以尋求完整的解決方案-進行黑客攻擊!
[編輯]:真正的問題是能夠從表單提交數據庫中刪除項目,而不是從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”的服務器端代碼是什么樣的。 本示例將從用戶的Web瀏覽器中的表中刪除該復選框,但對數據庫上的任何內容均無效。
您做錯了:)創建僅用於刪除的視圖。 發送該元素的POST或GET ID(或url),從db中刪除該元素,然后作為響應發送未刪除元素的列表。
像這樣的東西:
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調用delete函數的url,然后在成功時,使用data ['html']更新模板。
您可以問這個人: http : //twitter.com/sasklacz,因為他正在django上用ajax編寫一些教程,以為您提供所需的確切代碼。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.