Add filtering functionality for CID and User candidates in exam view
This commit is contained in:
@@ -15,6 +15,9 @@
|
||||
<div class="card h-100">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">CID candidates <small class="text-muted">({{ cid_user_count }})</small></h5>
|
||||
<div class="mb-2">
|
||||
<input id="cid-filter" class="form-control form-control-sm" placeholder="Filter CID candidates by CID, name, email or passcode">
|
||||
</div>
|
||||
<div id="htmx-info"></div>
|
||||
{% if cid_users %}
|
||||
<ul class="list-group list-group-flush">
|
||||
@@ -37,13 +40,6 @@
|
||||
<div class="small text-muted mt-1">{{ cid.name }}</div>
|
||||
<div class="small">Email: {{ cid.email }}</div>
|
||||
</div>
|
||||
<div class="text-end small">
|
||||
{% if cid.login_email_sent %}
|
||||
<span class="badge bg-success">Email sent</span>
|
||||
{% else %}
|
||||
<span class="badge bg-secondary">Not sent</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
{% endfor %}
|
||||
@@ -59,6 +55,9 @@
|
||||
<div class="card h-100">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">User candidates <small class="text-muted">({{ user_user_count }})</small></h5>
|
||||
<div class="mb-2">
|
||||
<input id="user-filter" class="form-control form-control-sm" placeholder="Filter User candidates by username or email">
|
||||
</div>
|
||||
{% if user_users %}
|
||||
<ul class="list-group list-group-flush">
|
||||
{% for user in user_users %}
|
||||
@@ -148,6 +147,37 @@
|
||||
}
|
||||
}catch(e){ console.error(e); }
|
||||
});
|
||||
|
||||
// Filtering helpers
|
||||
function normalizeText(s){ return (s||'').toString().toLowerCase(); }
|
||||
|
||||
function filterList(inputElem, listSelector){
|
||||
const q = normalizeText(inputElem.value.trim());
|
||||
document.querySelectorAll(listSelector).forEach(function(li){
|
||||
const text = normalizeText(li.textContent);
|
||||
if(!q || text.indexOf(q) !== -1){
|
||||
li.style.display = '';
|
||||
} else {
|
||||
li.style.display = 'none';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const cidFilter = document.getElementById('cid-filter');
|
||||
if(cidFilter){
|
||||
cidFilter.addEventListener('input', function(){
|
||||
// target CID list items only (left column)
|
||||
filterList(cidFilter, '.col-lg-6:first-of-type .list-group-item');
|
||||
});
|
||||
}
|
||||
|
||||
const userFilter = document.getElementById('user-filter');
|
||||
if(userFilter){
|
||||
userFilter.addEventListener('input', function(){
|
||||
// target user list items only (right column)
|
||||
filterList(userFilter, '.col-lg-6:nth-of-type(2) .list-group-item, .col-lg-6:nth-of-type(2) .list-group-item.d-flex');
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
||||
Reference in New Issue
Block a user