fix: checklist required mechanism
This commit is contained in:
parent
635c2a2c15
commit
583e5d6beb
|
|
@ -5,11 +5,14 @@
|
|||
<title>Lishwist</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<script>
|
||||
function someChecked(checkList) {
|
||||
if (!checkList) {
|
||||
return
|
||||
}
|
||||
return Array.from(checkList).some(({checked}) => checked);
|
||||
function getSubmissionNames(form) {
|
||||
return Array.from(new FormData(form).keys());
|
||||
}
|
||||
function acceptNames(form, submitId, ...acceptedNames) {
|
||||
const submissionNames = getSubmissionNames(form);
|
||||
const submitter = document.getElementById(submitId);
|
||||
const accepted = submissionNames.length > 0 && submissionNames.every((name) => acceptedNames.includes(name));
|
||||
submitter.disabled = !accepted;
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
|
|
|
|||
|
|
@ -9,9 +9,9 @@
|
|||
</nav>
|
||||
<h2>{{.Username}}'s list</h2>
|
||||
<form method="post" action="/{{.UserReference}}/update" autocomplete="off"
|
||||
onchange="const checked = someChecked(this.unclaimed) || someChecked(this.claimed); this.mode[0].disabled = !checked; this.mode[1].disabled = !checked;">
|
||||
<button type="submit" name="mode" value="claim" disabled>Claim/Unclaim</button>
|
||||
<button type="submit" name="mode" value="complete" disabled>Complete</button>
|
||||
onchange="acceptNames(this, 'claimSubmit', 'claimed', 'unclaimed'); acceptNames(this, 'completeSubmit', 'claimed');">
|
||||
<button id="claimSubmit" type="submit" name="mode" value="claim" disabled>Claim/Unclaim</button>
|
||||
<button id="completeSubmit" type="submit" name="mode" value="complete" disabled>Complete</button>
|
||||
<ul>
|
||||
{{range .Gifts}}
|
||||
<li>
|
||||
|
|
|
|||
|
|
@ -11,9 +11,8 @@
|
|||
</dd>
|
||||
</dl>
|
||||
<h2>Your list</h2>
|
||||
<form method="post" action="/wishlist/delete" onchange="this.mode.disabled = !someChecked(this.gift)"
|
||||
autocomplete="off">
|
||||
<button type="submit" name="mode" value="delete" disabled>Delete</button>
|
||||
<form method="post" action="/wishlist/delete" onchange="acceptNames(this, 'deleteSubmit', 'gift')" autocomplete="off">
|
||||
<button id="deleteSubmit" type="submit" name="mode" value="delete" disabled>Delete</button>
|
||||
<ul>
|
||||
{{range .Gifts}}
|
||||
<li>
|
||||
|
|
|
|||
Loading…
Reference in New Issue