Enhance bulk selection functionality in exam index template with visual cues and row click toggling
This commit is contained in:
@@ -55,7 +55,12 @@
|
|||||||
|
|
||||||
/* Show bulk controls area only when not d-none (toggled by JS) */
|
/* Show bulk controls area only when not d-none (toggled by JS) */
|
||||||
|
|
||||||
|
/* Visual affordances when bulk-mode is active */
|
||||||
|
#exam-list-wrapper.bulk-mode .mb-2 { cursor: pointer; }
|
||||||
|
#exam-list-wrapper .mb-2.selected { background-color: rgba(0,123,255,0.06); }
|
||||||
|
|
||||||
|
/* Defensive: hide bulk-controls unless bulk-mode is enabled */
|
||||||
|
#exam-list-wrapper:not(.bulk-mode) #bulk-controls { display: none !important; }
|
||||||
</style>
|
</style>
|
||||||
{% endblock css %}
|
{% endblock css %}
|
||||||
|
|
||||||
@@ -91,6 +96,22 @@
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Make clicking an exam row toggle its checkbox when bulk-mode is enabled.
|
||||||
|
document.addEventListener('click', function(e){
|
||||||
|
if(!examListWrapper.classList.contains('bulk-mode')) return;
|
||||||
|
// find the closest exam container (id like exam-<pk>)
|
||||||
|
const examItem = e.target.closest('[id^="exam-"]');
|
||||||
|
if(!examItem || !examListWrapper.contains(examItem)) return;
|
||||||
|
// don't toggle when clicking interactive controls
|
||||||
|
if(e.target.closest('a, button, input, label, form')) return;
|
||||||
|
|
||||||
|
const cb = examItem.querySelector('input.exam-select-checkbox');
|
||||||
|
if(cb){
|
||||||
|
cb.checked = !cb.checked;
|
||||||
|
examItem.classList.toggle('selected', cb.checked);
|
||||||
|
}
|
||||||
|
});
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|||||||
Reference in New Issue
Block a user