<form
hx-post={`/tierlists/${tierlistId}/grades`}
hx-target-4xx="#errors"
hx-target-5xx="#errors"
hx-swap="beforeend"
>
<input value={"1"} hidden="true" name="cardNumber" />
<div>{LetterGrades.map((g) =>
<label for={`grade-${g}`}><input type="radio" id={`grade-${g}`} name="letterGrade" value={g} />{g}</label>
)}</div>
<button type="submit">Grade</button>
</form>
<div id="errors">errors go here</div>
<form
hx-post={`/tierlists/${tierlistId}/grades`}
hx-target-4xx="#errors"
hx-target-5xx="#errors"
hx-swap="beforeend"
>
<input value={"1"} hidden="true" name="cardNumber" />
<div>{LetterGrades.map((g) =>
<label for={`grade-${g}`}><input type="radio" id={`grade-${g}`} name="letterGrade" value={g} />{g}</label>
)}</div>
<button type="submit">Grade</button>
</form>
<div id="errors">errors go here</div>