Yann Braga de35e3eb05 fix sandbox template Form components
- for Vue, Vue3, HTML, Svelte, Preact, HTML and Angular
2023-06-19 21:10:36 +02:00

33 lines
672 B
Svelte

<script>
/**
* Callback for when the form succeeds
*/
export let onSuccess;
let value = '';
function handleClick(event) {
value = event.target.value;
}
let complete = false;
function handleSubmit() {
onSuccess(value);
setTimeout(() => {
complete = true;
}, 500);
setTimeout(() => {
complete = false;
}, 1500);
}
</script>
<form id="interaction-test-form" on:submit|preventDefault={handleSubmit}>
<label>
Enter Value
<input type="text" data-testid="value" bind:value required on:click={handleClick} />
</label>
<button type="submit">Submit</button>
{#if complete}<p>Completed!!</p>{/if}
</form>