Fix admin edit persistence and explicit modal saves

This commit is contained in:
larssand
2026-03-25 22:29:19 +01:00
parent dd683d1b69
commit 9b068d36d2

View File

@@ -222,13 +222,13 @@ export function renderClassesView(deps) {
<div class="modal-card"> <div class="modal-card">
<div class="panel-header"> <div class="panel-header">
<h3>${t("common.edit")}</h3> <h3>${t("common.edit")}</h3>
<button class="btn" id="classEditCancel">${t("common.cancel")}</button> <button class="btn" id="classEditCancel" type="button">${t("common.cancel")}</button>
</div> </div>
<form id="classEditForm" class="panel-body form-grid cols-2"> <form id="classEditForm" class="panel-body form-grid cols-2">
<input name="name" required value="${escapeHtml(editingClass.name)}" placeholder="${t("classes.placeholder")}" /> <input name="name" required value="${escapeHtml(editingClass.name)}" placeholder="${t("classes.placeholder")}" />
<p class="form-error" id="classEditError" hidden></p> <p class="form-error" id="classEditError" hidden></p>
<div class="actions-inline"> <div class="actions-inline">
<button class="btn btn-primary" type="submit">${t("common.save")}</button> <button class="btn btn-primary" id="classEditSave" type="button">${t("common.save")}</button>
<button class="btn" id="classEditCancelFooter" type="button">${t("common.cancel")}</button> <button class="btn" id="classEditCancelFooter" type="button">${t("common.cancel")}</button>
</div> </div>
</form> </form>
@@ -282,12 +282,15 @@ export function renderClassesView(deps) {
renderView(); renderView();
}); });
document.getElementById("classEditForm")?.addEventListener("submit", (event) => { const commitClassEdit = () => {
event.preventDefault();
if (!editingClass) { if (!editingClass) {
return; return;
} }
const form = new FormData(event.currentTarget); const formNode = document.getElementById("classEditForm");
if (!(formNode instanceof HTMLFormElement)) {
return;
}
const form = new FormData(formNode);
const cleaned = String(form.get("name") || "").trim(); const cleaned = String(form.get("name") || "").trim();
if (!cleaned) { if (!cleaned) {
setFormError("classEditError", t("validation.required_name")); setFormError("classEditError", t("validation.required_name"));
@@ -298,7 +301,14 @@ export function renderClassesView(deps) {
setSelectedClassEditId(null); setSelectedClassEditId(null);
saveState(); saveState();
renderView(); renderView();
};
document.getElementById("classEditForm")?.addEventListener("submit", (event) => {
event.preventDefault();
commitClassEdit();
}); });
document.getElementById("classEditSave")?.addEventListener("click", commitClassEdit);
} }
export function renderDriversView(deps) { export function renderDriversView(deps) {
@@ -372,7 +382,7 @@ export function renderDriversView(deps) {
<div class="modal-card"> <div class="modal-card">
<div class="panel-header"> <div class="panel-header">
<h3>${t("common.edit")}</h3> <h3>${t("common.edit")}</h3>
<button class="btn" id="driverEditCancel">${t("common.cancel")}</button> <button class="btn" id="driverEditCancel" type="button">${t("common.cancel")}</button>
</div> </div>
<form id="driverEditForm" class="panel-body form-grid cols-4"> <form id="driverEditForm" class="panel-body form-grid cols-4">
<input name="name" required value="${escapeHtml(editingDriver.name)}" placeholder="${t("drivers.name_placeholder")}" /> <input name="name" required value="${escapeHtml(editingDriver.name)}" placeholder="${t("drivers.name_placeholder")}" />
@@ -385,7 +395,7 @@ export function renderDriversView(deps) {
<input name="transponder" value="${escapeHtml(editingDriver.transponder || "")}" placeholder="${t("drivers.transponder_placeholder")}" /> <input name="transponder" value="${escapeHtml(editingDriver.transponder || "")}" placeholder="${t("drivers.transponder_placeholder")}" />
<p class="form-error" id="driverEditError" hidden></p> <p class="form-error" id="driverEditError" hidden></p>
<div class="actions-inline"> <div class="actions-inline">
<button class="btn btn-primary" type="submit">${t("common.save")}</button> <button class="btn btn-primary" id="driverEditSave" type="button">${t("common.save")}</button>
<button class="btn" id="driverEditCancelFooter" type="button">${t("common.cancel")}</button> <button class="btn" id="driverEditCancelFooter" type="button">${t("common.cancel")}</button>
</div> </div>
</form> </form>
@@ -459,12 +469,15 @@ export function renderDriversView(deps) {
renderView(); renderView();
}); });
document.getElementById("driverEditForm")?.addEventListener("submit", (event) => { const commitDriverEdit = () => {
event.preventDefault();
if (!editingDriver) { if (!editingDriver) {
return; return;
} }
const form = new FormData(event.currentTarget); const formNode = document.getElementById("driverEditForm");
if (!(formNode instanceof HTMLFormElement)) {
return;
}
const form = new FormData(formNode);
const cleanedName = String(form.get("name") || "").trim(); const cleanedName = String(form.get("name") || "").trim();
const cleanedClassId = String(form.get("classId") || "").trim(); const cleanedClassId = String(form.get("classId") || "").trim();
const cleanedBrand = String(form.get("brand") || "").trim(); const cleanedBrand = String(form.get("brand") || "").trim();
@@ -492,7 +505,14 @@ export function renderDriversView(deps) {
setSelectedDriverEditId(null); setSelectedDriverEditId(null);
saveState(); saveState();
renderView(); renderView();
};
document.getElementById("driverEditForm")?.addEventListener("submit", (event) => {
event.preventDefault();
commitDriverEdit();
}); });
document.getElementById("driverEditSave")?.addEventListener("click", commitDriverEdit);
} }
export function renderCarsView(deps) { export function renderCarsView(deps) {
@@ -562,7 +582,7 @@ export function renderCarsView(deps) {
<div class="modal-card"> <div class="modal-card">
<div class="panel-header"> <div class="panel-header">
<h3>${t("common.edit")}</h3> <h3>${t("common.edit")}</h3>
<button class="btn" id="carEditCancel">${t("common.cancel")}</button> <button class="btn" id="carEditCancel" type="button">${t("common.cancel")}</button>
</div> </div>
<form id="carEditForm" class="panel-body form-grid cols-4"> <form id="carEditForm" class="panel-body form-grid cols-4">
<input name="name" required value="${escapeHtml(editingCar.name)}" placeholder="${t("cars.name_placeholder")}" /> <input name="name" required value="${escapeHtml(editingCar.name)}" placeholder="${t("cars.name_placeholder")}" />
@@ -570,7 +590,7 @@ export function renderCarsView(deps) {
<input name="transponder" required value="${escapeHtml(editingCar.transponder || "")}" placeholder="${t("cars.transponder_placeholder")}" /> <input name="transponder" required value="${escapeHtml(editingCar.transponder || "")}" placeholder="${t("cars.transponder_placeholder")}" />
<p class="form-error" id="carEditError" hidden></p> <p class="form-error" id="carEditError" hidden></p>
<div class="actions-inline"> <div class="actions-inline">
<button class="btn btn-primary" type="submit">${t("common.save")}</button> <button class="btn btn-primary" id="carEditSave" type="button">${t("common.save")}</button>
<button class="btn" id="carEditCancelFooter" type="button">${t("common.cancel")}</button> <button class="btn" id="carEditCancelFooter" type="button">${t("common.cancel")}</button>
</div> </div>
</form> </form>
@@ -643,12 +663,15 @@ export function renderCarsView(deps) {
renderView(); renderView();
}); });
document.getElementById("carEditForm")?.addEventListener("submit", (event) => { const commitCarEdit = () => {
event.preventDefault();
if (!editingCar) { if (!editingCar) {
return; return;
} }
const form = new FormData(event.currentTarget); const formNode = document.getElementById("carEditForm");
if (!(formNode instanceof HTMLFormElement)) {
return;
}
const form = new FormData(formNode);
const cleanedName = String(form.get("name") || "").trim(); const cleanedName = String(form.get("name") || "").trim();
const cleanedBrand = String(form.get("brand") || "").trim(); const cleanedBrand = String(form.get("brand") || "").trim();
const cleanedTp = String(form.get("transponder") || "").trim(); const cleanedTp = String(form.get("transponder") || "").trim();
@@ -674,5 +697,12 @@ export function renderCarsView(deps) {
setSelectedCarEditId(null); setSelectedCarEditId(null);
saveState(); saveState();
renderView(); renderView();
};
document.getElementById("carEditForm")?.addEventListener("submit", (event) => {
event.preventDefault();
commitCarEdit();
}); });
document.getElementById("carEditSave")?.addEventListener("click", commitCarEdit);
} }