allow only number in phone number input (#10)
All checks were successful
delpoy / build-and-deploy (push) Successful in 41s

This commit is contained in:
bytedream 2023-11-30 20:20:12 +01:00
parent 4e16487d3d
commit 971ca4bc75
2 changed files with 26 additions and 6 deletions

View File

@ -7,6 +7,7 @@
export let type = 'text'; export let type = 'text';
export let value: string | null = null; export let value: string | null = null;
export let placeholder: string | null = null; export let placeholder: string | null = null;
export let pattern: RegExp | null = null;
export let required = false; export let required = false;
export let disabled = false; export let disabled = false;
export let readonly = false; export let readonly = false;
@ -91,10 +92,22 @@
bind:this={inputElement} bind:this={inputElement}
autocomplete="off" autocomplete="off"
on:input={(e) => { on:input={(e) => {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
value = e.target?.value; value = e.target?.value;
input(e); if (pattern && !pattern.test(e.target?.value)) {
if (inputElement?.value.endsWith(e.data)) {
value = e.target?.value.substring(0, -e.data.length);
}
return false;
}
return input(e);
}}
on:paste={(e) => {
if (
pattern &&
!pattern.test((e.clipboardData || window.clipboardData).getData('text'))
) {
e.preventDefault();
}
}} }}
on:click={click} on:click={click}
/> />

View File

@ -39,8 +39,15 @@
async function sendRegister() { async function sendRegister() {
// eslint-disable-next-line no-async-promise-executor // eslint-disable-next-line no-async-promise-executor
registerRequest = new Promise(async (resolve, reject) => { registerRequest = new Promise(async (resolve, reject) => {
if (birthdayInput.valueAsDate || new Date() > new Date(Date.now() - 1000 * 60 * 60 * 24 * 365 * 6)) { if (
reject(Error('Bitte gib deinen vollständigen Geburtstag und die korrekte Jahreszahl an. Du musst mindestens 6 Jahre alt sein.')) birthdayInput.valueAsDate ||
new Date() > new Date(Date.now() - 1000 * 60 * 60 * 24 * 365 * 6)
) {
reject(
Error(
'Bitte gib deinen vollständigen Geburtstag und die korrekte Jahreszahl an. Du musst mindestens 6 Jahre alt sein.'
)
);
return; return;
} }
@ -100,7 +107,7 @@
<span slot="label">Geburtstag</span> <span slot="label">Geburtstag</span>
<span slot="notice">Die Angabe hat keine Auswirkungen auf das Spielgeschehen</span> <span slot="notice">Die Angabe hat keine Auswirkungen auf das Spielgeschehen</span>
</Input> </Input>
<Input id="telephone" name="telephone" type="tel"> <Input id="telephone" name="telephone" type="tel" pattern={new RegExp(/^[+()\s/\d]+$/)}>
<span slot="label">Telefonnummer</span> <span slot="label">Telefonnummer</span>
<p slot="notice"> <p slot="notice">
Diese nutzen wir, um Dich in der Whatsapp-Gruppe zuzuordnen und kontaktieren zu können. Diese nutzen wir, um Dich in der Whatsapp-Gruppe zuzuordnen und kontaktieren zu können.