I have form
like below.
<form onSubmit={handleSubmit(onValid)}>
<input
{...register("searchname", { required: "이름을 적어주세요." })}
onChange={(text)=> setSearchinput(text)}
type="text" placeholder="이름을 검색해주세요." className="focus:outline-none focus:border-[#FF2D78] border-2 w-56 border-gray-500 rounded-md py-1 text-center"></input>
<button className="bg-gray-300 rounded-md py-1 px-3 ml-2">검색</button>
</form>
and I use useForm()
to submit this form.
It works perfect.
But when I press enter
instead of clicking button
.
input value is not up-to-date or isn't applied at all.
for example,
I wrote input as 'abc' and then 'cdb' and press enter then abc value is applied, not cdb.
How to submit with up-to-date input with enter key instead of clicking?
CodePudding user response:
I've noticed something similar to that when using the register together with the onChange prop direct on the input. I just tried it on my repo and I got your issue if I add onChange to the input:
I've found this here on the site and it worked:
https://stackoverflow.com/a/69448858/5288271
Basically, do this (move the onChange inside the register):
{...register("searchname", { required: "이름을 적어주세요.", onChange={(text)=> setSearchinput(text)} })}