0

necesito redireccionar a otra página para realizar un reseteo de clave mediante un link hacia dicha página, esto dependiendo de la opción que el usuario escoja en el segundo select, cada opción es una url distinta. El proyecto es en ReactJs y se requirió hacer la simulación de formulario, es solamente para dar vistosidad al usuario, los datos no se necesitan almacenar. Por el momento, tengo así el código:

<div className="register-box">
      <h3 className="register-box-head">
         {t("Soporte")}
       </h3>
  <form className="auth-form" onSubmit={this.handleSubmit} >
      <div className="form-group">
          <label htmlFor="accion">
           {t("¿Que acción desea realizar?")}
          </label>
          <select className="select"
               onClick={this.handleToggle}
               name="accion"
               onChange={this.handleChange}>
              <option value="0" selected>--Seleccione una opción--</option>
              <option>Recuperar contraseña</option>
              <option>Renovar plan</option>
           </select>
         </div> 
         <div className="form-group">
             <label htmlFor="sucursal">
               {t("Sucursal")}
             </label> 
             <select className="select" 
                name="sucursal"
                onChange={this.handleChange}>
                <option value="0" selected>--Seleccione sucursal--</option>
                 <option value="1" >Option 1</option>
                 <option value="2" >Option 2</option>
                 <option value="5" >Option 3</option>
              </select>
           </div>
           <Link className="btn btn-primary auth-btn"
              to={""}>
              {t("Aceptar")}
           </Link>
     </form>
</div>

Mi pregunta es, de qué forma podría redirigir a dichas paginas, por cada valor de opción del segundo select que se elijar?

2
  • Te refieres a redirigir a varias páginas pudiendo seleccionar varias opciones o que redirija a una en concreto dependiendo de qué opción elija? Commented el 22 may. 2020 a las 10:06
  • @AdolfoOnrubia Si, redirigir dependiendo de la opción que elija
    – PHJ
    Commented el 22 may. 2020 a las 16:33

1 respuesta 1

0

Muy sencillo, podrías hacer lo siguiente:

Defines las URLS de las opciones que entiendo son fijas:

const redirectLinks = {
  a: "https://link1",
  b: "https://link2"
};

Ahora creas un variable de estado dentro de la clase React que implemente el formulario

class Formulario extends React.Component {
  state = {
    selectedOption: "",
  }

  handleChange = (option) => () => {  // option === "a"
    this.setState({ selectedOption: redirectLinks[option] });
  }

  handleClick = () => {
    window.location.href = this.state.selectedOption;
  }

  render() {
    return (
      ...
      onChange={this.handleChange}
      onClick={this.handleClick}
      ....
    )
  }
}

Con esto actualizas el valor de selectedOption cada vez que eliges una opción de manera que al momento de hacer click redirige a la selección activa.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.