Skip to content

Instantly share code, notes, and snippets.

@apoorvmote

apoorvmote/form.ts

Last active March 3, 2021 14:58
Show Gist options
  • Save apoorvmote/f5289acb86465b65abb5e100ee892ad8 to your computer and use it in GitHub Desktop.
Save apoorvmote/f5289acb86465b65abb5e100ee892ad8 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
form.ts
...
<input autoComplete="off" type="text" name="title" id="todoTitle" ref={register} />
...
<select name="category" id="category" ref={register} />
...
<input type="radio" name="priority" id="low" value='low' className='mr-2' defaultChecked ref={register} />
...
<input type="radio" name="priority" id="med" value='med' className='mr-2' ref={register} />
...
<input type="radio" name="priority" id="high" value='high' className='mr-2' ref={register} />
Raw
formSubmit.ts
<form className='grid gap-4 grid-col-1' onSubmit={handleSubmit(onSubmit)}>
Raw
importForm.ts
import { useForm } from 'react-hook-form'
const { register, handleSubmit } = useForm<TodoInput>()
Raw
interface.ts
interface TodoInput {
title: string
priority: string
category: string
}
Raw
onSubmit.ts
async function onSubmit(input: TodoInput) {
console.log(input)
}
Raw
useForm.ts
const { register, handleSubmit } = useForm<TodoInput>({
defaultValues: {
title: 'get bread',
category: 'grocery',
priority: 'med'
}
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment