fix(person): block submit while a life-date input is partial
A partial date (e.g. "14.03.") left the hidden ISO input empty, so saving the edit form silently cleared a stored date. PersonLifeDateField now delegates to the shared DateInput primitive (inline format error, calendar validation) and sets a custom validity while the error is present, so the browser blocks native submission for both person forms. A full clear stays submittable - that is the intentional clear path. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
@@ -11,6 +11,11 @@ interface Props {
|
||||
placeholder?: string;
|
||||
class?: string;
|
||||
onchange?: () => void;
|
||||
ariaLabel?: string;
|
||||
ariaDescribedby?: string;
|
||||
// Escape hatch for callers that need the raw element, e.g. to set a custom
|
||||
// validity and block native form submission while the date is partial.
|
||||
inputEl?: HTMLInputElement;
|
||||
}
|
||||
|
||||
let {
|
||||
@@ -20,7 +25,10 @@ let {
|
||||
id,
|
||||
placeholder,
|
||||
class: className = '',
|
||||
onchange
|
||||
onchange,
|
||||
ariaLabel,
|
||||
ariaDescribedby,
|
||||
inputEl = $bindable()
|
||||
}: Props = $props();
|
||||
|
||||
let display = $state(isoToGerman(value ?? ''));
|
||||
@@ -76,10 +84,13 @@ function handleInput(e: Event) {
|
||||
</script>
|
||||
|
||||
<input
|
||||
bind:this={inputEl}
|
||||
type="text"
|
||||
inputmode="numeric"
|
||||
maxlength="10"
|
||||
id={id}
|
||||
aria-label={ariaLabel}
|
||||
aria-describedby={ariaDescribedby}
|
||||
value={display}
|
||||
placeholder={placeholder ?? m.form_placeholder_date()}
|
||||
oninput={handleInput}
|
||||
|
||||
Reference in New Issue
Block a user