function MaterialHookForm() { const { register, handleSubmit, setValue, reset, watch } = useForm({ defaultValues, }); const selectValue = watch('select'); const onSubmit = (data) => console.log(data); useEffect(() => { register({ name: 'select' }); }, [register]); const handleChange = (e) => setValue('select', e.target.value); return ( <form onSubmit={handleSubmit(onSubmit)}> <Select value={selectValue} onChange={handleChange}> <MenuItem value={10}>Ten</MenuItem> <MenuItem value={20}>Twenty</MenuItem> <MenuItem value={30}>Thirty</MenuItem> </Select> <br /> <Input inputRef={register} name='input' /> <button type='button' onClick={() => reset({ ...defaultValues })}> Reset </button> <input type='submit' /> </form> ); }
const UserForm = (props) => { const initialFormState = { id: null, name: '', username: '' }; const { register, errors, handleSubmit, setValue } = useForm({ defaultValues: props.user ? props.user : initialFormState, }); setValue('name', props.user ? props.user.name : ''); setValue('username', props.user ? props.user.username : ''); return ( <form onSubmit={handleSubmit(props.onSubmit)}> <label>Name</label> <input type='text' name='name' ref={register({ required: { value: true, message: 'name is required' } })} /> <div>{errors?.name?.message}</div> <label>Username</label> <input type='text' name='username' ref={register({ required: { value: true, message: 'username is required' } })} /> <div>{errors?.username?.message}</div> <button>{props.user ? 'Edit User' : 'Add new user'}</button> </form> ); }
dispatch(add_line(newLine)) swal('New Item Added',`${Item_Name}`,'success') setValue([ {"Item_ID": ""}, {"Item_Name": ""},