2

Estoy intentando obtener el valor (value) de la opción que estoy seleccionando, en un select, para obtener el id y hacer mas cosas después, el problema es que puedo obtener ese valor pero no el texto dentro de la etiqueta Option.

Este es mi parte html para explicarme mejor:

<div className="form-group">
     <select
         name="material_type"
         className="form-control"
         onChange={this.handleInput}
         >
            <option value="11">Papel</option>
            <option value="12">Carton</option>
            <option value="13">Plastico</option>
            <option value="14">Metal</option>
            <option value="15">Electronico</option>
    </select>
</div>

Puedo obtener el value (es el id que quiero manejar), pero el texto (papel, carton, plastico, etc) no se como obtenerlo.

Este es mi codigo Javascript para obtener el value:

 handleInput(e){
        const {value, name} = e.target;
        console.log(e.target.value, e.target.name);
        this.setState({
            [name]: value
        });
}

El código de arriba me muestra con e.target.value mi id que quiero, pero no puedo obtener el texto, intenté con e.target.text pero me aparece indefinido, no se que mas puedo intentar o si tengo otra forma de guardar el id de cada material

1 respuesta 1

1

El valor que recibe la función es e, que representa el evento, y la propiedad target, es una referencia del elemento que lanzó el evento. Para este caso el Select.

Cuando se modifica la selección del select, el valor que se setea es el value, más no el texto.

Para obtener el texto hace falta obtener primero la referencia al elemento option que está seleccionado, esta se puede obtener con selectedIndex accediendo a la colección options y pasando el indice obtenido anteriormente para luego obtener el texto con text-

handleInput(e){
    let index = e.target.selectedIndex;
    console.log(e.target.options[index].text); // obtiene el texto de la opción seleccionada
}
1
  • 1
    Muchas gracias me funcionó, llevaba un tiempo sin saber como se hacia. :D
    – Loperso
    el 26 may. 2019 a las 19:39

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.