ashpie
/
swaf
1
0
Fork 0
Code Issues 22 Pull Requests Releases 11 Wiki Activity

fix(front/checkbox): change value to boolean and use handleInput

This commit is contained in:
Alice Gaudon 2022-02-19 11:30:06 +01:00
parent 535c8afdb1
commit 231aa8dcd7
1 changed files with 20 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/assets/views/utils/Field.svelte
View File

@ -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}>