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

158
Vistas
Cómo obtener los valores de <select multipile={true}> en ReactJs

Tengo un formulario que tiene un campo de selección múltiple. Solo se obtiene un valor en el que se hace clic primero, pero no en los otros valores en los que se hace clic después de hacer clic en el primero. ¿Cómo obtener los valores? A continuación se muestra mi código.

asignación de estado, aquí turno y tablero son el estado para almacenar los valores del campo de selección múltiple

 const [formData, setFormData] = useState({ name: "", photo: "", adhar: "", phone: "", location: "", fullAddress: "", age: "", gender: 0, schooName: "", experience: "", teachForNoDays: "", shift: [], subject: "", teachClass: "", board: [], homeTuition: false, fees: "", homeTuitionFees: "", });

Función onChange

 const changeFormData = (e) => { // this is how we do when to specifically define a type in the target const { name, type } = e.target; console.log(e.target.value); setFormData({ ...formData, [name]: e.target[type === "checkbox" ? "checked" : "value"], }); };

los campos, solo poniendo el turno uno aquí

 <select name="shift" id="shift" defaultValue={shift} size={2} onChange={(e) => changeFormData(e)} multiple={true} > <option value="Evening">Evening</option> <option value="Morning">Morning</option> </select>
about 4 years ago · Santiago Trujillo
1 Respuestas
Responde la pregunta

0

<select> tiene un campo e.target.options que es una matriz que contiene todas las opciones seleccionadas.

Debe tener eso en cuenta en changeFormData() .

No olvide " controlar " correctamente el valor de su componente seleccionado asignándole el valor actual:

 <select ... value={formData.shift} multiple > ... </select>
about 4 years ago · Santiago Trujillo 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