Enhance user list handling by adding supervisor email input and updating JSON submission logic
This commit is contained in:
@@ -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"
|
||||
|
||||
Reference in New Issue
Block a user