Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

146
Vistas
Radio buttons with react-hook-form validation

I have created a form having radio button and done validation with react hook form but while showing log data in console it shows always "on" on selection radio button.

<div className="">
              <label htmlFor="" className=" ">
                US Citizen?
              </label>
              <div className="">
                <div className="radio-container">
                  <input type="radio" name="radio" {...register("usCitizen")} />
                  <label>Yes</label>
                </div>

                <div className="radio-container">
                  <input type="radio" name="radio" {...register("usCitizen")} />
                  <label>No</label>
                </div>
              </div>
            </div>
about 4 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

Use submit input type. (handleSubmit)

<form onSubmit={handleSubmit(onSubmit)}>
                <div className="">
                    <label htmlFor="" className=" ">US Citizen?</label>
                        <div className="">
                            <div className="radio-container">
                                <input type="radio" name="radio" value="yes" {...register("usCitizen")} />
                           <label>Yes</label>
                        </div>
        
                        <div className="radio-container">
                          <input type="radio" name="radio" value="no" {...register("usCitizen")} />
                          <label>No</label>
                        </div>
                      </div>
                    </div>
       <input type="submit" value="Submit" />
</form>
about 4 years ago · Juan Pablo Isaza Denunciar

0

I think you need to add a function that handles the onclick event and also add a useState that can set the value to true or false Im not sure about the syntax but it pretty much like this:

const [radio, setRadio] = useState(false);

function handleClick(event){
    const [val] = event.target.value;

    setRadio(()=>{
    if (val === true){
       return(false)
    }
    else{
    return(true)
    }
}

}
<input type="radio" onclick={handleClick} value={radio}> 
about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda