fix(front/checkbox): change value to boolean and use handleInput
This commit is contained in:
parent
535c8afdb1
commit
231aa8dcd7
@ -8,7 +8,7 @@
|
|||||||
|
|
||||||
export let type: string;
|
export let type: string;
|
||||||
export let name: string;
|
export let name: string;
|
||||||
type FieldValue = string | number | Record<string, FieldValue>;
|
type FieldValue = string | number | boolean | Record<string, FieldValue>;
|
||||||
export let value: FieldValue | undefined = undefined;
|
export let value: FieldValue | undefined = undefined;
|
||||||
export let initialValue: FieldValue | undefined = undefined;
|
export let initialValue: FieldValue | undefined = undefined;
|
||||||
export let placeholder: string | undefined = undefined;
|
export let placeholder: string | undefined = undefined;
|
||||||
@ -58,18 +58,23 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
function handleInput() {
|
function handleInput() {
|
||||||
// in here, you can switch on type and implement
|
switch (this.type) {
|
||||||
// whatever behaviour you need
|
case 'number':
|
||||||
value = type.match(/^(number|range)$/)
|
case 'range':
|
||||||
? +this.value
|
value = +this.value;
|
||||||
: this.value;
|
break;
|
||||||
|
case 'file':
|
||||||
if (this.type === 'file') {
|
handleFileInput();
|
||||||
handleFileInput();
|
break;
|
||||||
}
|
case 'datetime-local':
|
||||||
|
value = dateToIsoString(new Date(this.value));
|
||||||
if (this.type === 'datetime-local') {
|
break;
|
||||||
value = dateToIsoString(new Date(this.value));
|
case 'checkbox':
|
||||||
|
value = !!this.checked;
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
value = this.value;
|
||||||
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -423,7 +428,8 @@
|
|||||||
on:focusout={() => focused = false}></textarea>
|
on:focusout={() => focused = false}></textarea>
|
||||||
</div>
|
</div>
|
||||||
{:else if type === 'checkbox'}
|
{:else if type === 'checkbox'}
|
||||||
<input {type} {name} id={fieldId} checked={value === 'on'} {...$$restProps} bind:this={input}>
|
<input {type} {name} id={fieldId} checked={!!value} {...$$restProps} bind:this={input}
|
||||||
|
on:change={handleInput}>
|
||||||
{:else if type === 'datetime-local'}
|
{:else if type === 'datetime-local'}
|
||||||
<input {type} bind:this={input} on:input={handleInput} value={initialDatetimeLocalValue}>
|
<input {type} bind:this={input} on:input={handleInput} value={initialDatetimeLocalValue}>
|
||||||
<input type="hidden" {name} {value}>
|
<input type="hidden" {name} {value}>
|
||||||
|
Loading…
Reference in New Issue
Block a user