Enhance user list handling by adding supervisor email input and updating JSON submission logic

This commit is contained in:
Ross
2025-11-03 09:46:24 +00:00
parent 7eeb989b9e
commit 3ea384542d
+85 -2
View File
@@ -157,14 +157,14 @@
users.push(user)
emails.push(user.email)
console.log(user)
$("#users-list").append(`<li>Name: <span class="name">${user.first_name} ${user.last_name}</span><br/>Email: ${user.email}<br/>Grade: ${user.grade}<br/>Supervisor: ${user.supervisor_name}<br/>Supervisor email: ${user.supervisor_email}<br/>
$("#users-list").append(`<li data-index="${i}">Name: <span class="name">${user.first_name} ${user.last_name}</span><br/>Email: <span class="email">${user.email}</span><br/>Grade: <span class="grade">${user.grade}</span><br/>Supervisor: <span class="supervisor_name">${user.supervisor_name || ''}</span><br/>
<form>
Supervisor email: <input class="supervisor-email-input" name="supervisor_email" type="text" value="${user.supervisor_email || ''}" placeholder="supervisor email" style="width: 320px; display: none;" /> <br/>
<input type="text" name="first_name" value="${user.first_name}" hidden>
<input type="text" name="last_name" value="${user.last_name}" hidden>
<input type="text" name="email" value="${user.email}" hidden>
<input type="text" name="grade" value="${user.grade}" hidden>
<input type="text" name="supervisor_name" value="${user.supervisor_name}" hidden>
<input type="text" name="supervisor_email" value="${user.supervisor_email}" hidden>
<button
hx-post="{% url 'accounts_bulk_create_check' %}"
hx-trigger="load"
@@ -186,21 +186,104 @@
// Make sure the new hyperscript works
_hyperscript.processNode($("#users-list")[0]);
htmx.process($("#users-list")[0]);
$("#user-list-json").val(JSON.stringify(users));
// Run the supervisor input toggle once HTMX has processed the checks
updateSupervisorInputs();
$("#user-list-json").val(JSON.stringify(users));
$("#submit-users").show();
// When submit is clicked, rebuild users JSON from current DOM values (to pick up any edited supervisor emails)
window.prepareAndSubmit = function(){
var rebuilt = [];
$("#users-list li").each(function(idx, li){
var $li = $(li);
var first_last = $li.find('.name').text().trim();
var parts = first_last.split(/\s+/);
var first = parts[0] || '';
var last = parts.slice(1).join(' ') || '';
var email = $li.find('.email').text().trim();
var grade = $li.find('.grade').text().trim();
var supervisor_name = $li.find('.supervisor_name').text().trim();
var supervisor_email = $li.find('.supervisor-email-input').val().trim();
rebuilt.push({
first_name: first,
last_name: last,
email: email,
grade: grade,
supervisor_name: supervisor_name,
supervisor_email: supervisor_email
});
});
$("#user-list-json").val(JSON.stringify(rebuilt));
// submit the form
document.getElementById('user-list-form').submit();
};
// Attach form submit handler to rebuild JSON just before submit (covers cases where user presses Enter)
$('#user-list-form').on('submit', function(e){
e.preventDefault();
// rebuild
var rebuilt = [];
$("#users-list li").each(function(idx, li){
var $li = $(li);
var first_last = $li.find('.name').text().trim();
var parts = first_last.split(/\s+/);
var first = parts[0] || '';
var last = parts.slice(1).join(' ') || '';
var email = $li.find('.email').text().trim();
var grade = $li.find('.grade').text().trim();
var supervisor_name = $li.find('.supervisor_name').text().trim();
var supervisor_email = $li.find('.supervisor-email-input').val().trim();
rebuilt.push({
first_name: first,
last_name: last,
email: email,
grade: grade,
supervisor_name: supervisor_name,
supervisor_email: supervisor_email
});
});
$("#user-list-json").val(JSON.stringify(rebuilt));
// submit without triggering this handler again
$(this).off('submit');
this.submit();
});
// If we want to show the table
//document.body.appendChild(myTable);
document.addEventListener('htmx:afterRequest', function(evt) {
updateWarnings();
updateSupervisorInputs();
});
}
</script>
<script>
// Hide the supervisor email input if the server has indicated the supervisor exists
function updateSupervisorInputs(){
try {
document.querySelectorAll('#users-list li').forEach(function(li){
var statusSpan = li.querySelector('.check-status');
if (!statusSpan) return;
var text = statusSpan.textContent.trim().toLowerCase();
var input = li.querySelector('.supervisor-email-input');
if (!input) return;
// If the server response indicates the supervisor exists (and not 'does not exist'), hide the input
if (text.indexOf('supervisor exists') !== -1 && text.indexOf('does not exist') === -1) {
input.style.display = 'none';
} else {
input.style.display = '';
}
});
} catch (e) {
console.error('updateSupervisorInputs error', e);
}
}
</script>
<script type="text/hyperscript">
def updateWarnings()
log "test"