ross/penracourses
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Enhance bulk delete functionality to support multiple checkbox naming conventions and improve debug information display when no items are deleted.

Browse Source
This commit is contained in:
Ross
2025-10-20 12:39:59 +01:00
parent 980bb199cf
commit 264270ce00
3 changed files with 66 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/question_table_view.html
+32 -9
View File
@@ -18,9 +18,9 @@
</form>
</details>
</div>
{% render_table table %}
<form id="bulk-delete-form" method="post" action="{% url 'generic:bulk_delete_questions' %}" hx-post="{% url 'generic:bulk_delete_questions' %}" hx-target="#bulk-delete-result" hx-swap="innerHTML">
{% render_table table %}
<form id="bulk-delete-form" method="post" action="{% url app_name|add:':bulk_delete_questions' %}" hx-post="{% url app_name|add:':bulk_delete_questions' %}" hx-target="#bulk-delete-result" hx-swap="innerHTML">
{% csrf_token %}
<input type="hidden" name="app" value="{{ app_name }}">
<input type="hidden" name="selected" id="bulk-selected-input" value="">
@@ -33,10 +33,6 @@
data-exam_list_url="{% url 'api-1:'|add:app_name|add:'_user_exams' %}"
data-type={{app_name}} data-csrf="{{ csrf_token}}">Add selected questions to
exam</button>
<button id="button-select-remove-questions"
data-question_bulk_delete_url="{% url app_name|add:':bulk_delete_questions' %}"
data-csrf="{{ csrf_token}}">Delete selected questions</button>
<div id="exam-options"></div>
{% endblock %}
@@ -45,11 +41,35 @@
// When the user submits the bulk-delete form, gather selected checkboxes from the table
document.getElementById('bulk-delete-form').addEventListener('submit', function(e){
const selected = [];
document.querySelectorAll('input[type=checkbox][name="selection"]:checked, input[type=checkbox][name="selection[]"]:checked, input[type=checkbox][name="selection\[\]"]:checked').forEach(function(cb){
// many tables render checkbox inputs with value attribute as pk
// Try common patterns: name="selection", name="selection[]", name="selection-<pk>", data-pk, or any checked checkbox inside the table
// 1) explicit selection name
document.querySelectorAll('input[type=checkbox][name="selection"]:checked, input[type=checkbox][name="selection[]"]:checked').forEach(function(cb){
if(cb.value) selected.push(cb.value);
else if(cb.dataset && cb.dataset.pk) selected.push(cb.dataset.pk);
});
// 2) inputs with name like selection-<pk> or selection_<pk>
document.querySelectorAll('input[type=checkbox]').forEach(function(cb){
if(!cb.checked) return;
const n = cb.getAttribute('name') || '';
if(n.startsWith('selection-') || n.startsWith('selection_')){
// try extract trailing number
const m = n.match(/selection[-_](\d+)/);
if(m && m[1]){
selected.push(m[1]);
} else if(cb.value){
selected.push(cb.value);
}
}
// 3) fallback: any checked checkbox inside the rendered table
if(cb.closest('table') && cb.checked && cb.value){
selected.push(cb.value);
}
// 4) data-pk attribute
if(cb.checked && cb.dataset && cb.dataset.pk){
selected.push(cb.dataset.pk);
}
});
// fallback: django-tables2 renders checkboxes with accessor name 'selection' and value
if(selected.length === 0){
// try to find inputs inside table
@@ -57,7 +77,10 @@
if(cb.checked && cb.value) selected.push(cb.value);
});
}
document.getElementById('bulk-selected-input').value = selected.join(',');
// dedupe
const uniq = Array.from(new Set(selected.map(String)));
console.log('Bulk delete selected ids:', uniq);
document.getElementById('bulk-selected-input').value = uniq.join(',');
// allow HTMX to submit
});
</script>