Checkbox is not unchecking after submit form

Advertisements

Usually the checkhook should check out again after sending the data if you set the initial state back to false.
When the check is set, the boolean value changes to true because the initial value is set to false.
Unfortunately, this does not happen in this case…. Why?

const [check, setCheck] = useState(false)

const checkHandler = () => {
    setCheck(true)
}

// code....

onSubmit={(e) => {
  e.preventDefault()
  axios.post("http://localhost:8000", {
  check                   
  })
  .then((res) => {
  console.log(res.data)
  setCheck(false)
  })

// code...

<label 
 htmlFor='checkbox_id' 
 id='label'
>
<input
type="checkbox" 
id="checkbox_id"
check={check ? "checked" : "unchecked"}
onChange={checkHandler}
/>                    
</label>

<button type="submit" value="submit" name="submit">submit</button>

>Solution :

From:-

check={check ? "checked" : "unchecked"}

To:-

checked={check}

attribute spelling is wrong and
checked attribute accepts only boolean value.

Leave a ReplyCancel reply