> Faqs > Cómo detectar el cambio del value de un textarea cuando se altera de manera programática

Cómo detectar el cambio del value de un textarea cuando se altera de manera programática

Tengo una duda en Javascript.

Si tengo un elemento de formulario tipo textarea... ¿hay algún evento que se dispare cuando se cambia programaticamente el atributo value del textarea?

Es decir, alguien hace algo como esto:

document.getElementById("miTextarea").value = "Nuevo valor";

En ese caso ¿existe algún evento que se dispare en el navegador?

Respuestas

Pues me temo que no existe ningún evento que se dispare en una situación como esa. Es decir, si cambias programáticamente el valor del textarea no se genera ningún evento de manera automática.

La verdad es que tiene cierto sentido... los eventos son para que tú estés al tanto sobre cambios del textarea principalmente cuando vienen realizados por parte del usuario, por lo que en principio si lo cambias con tu propio código ya sabes que el value del textarea está cambiando.

Ahora bien, si lo que ocurre es que necesitas avisar a otros programas o componentes que acabas de cambiar ese valor del textarea se me ocurre que podrías tú mismo levantar un evento de cambio del textarea.

Esto lo podrías hacer con un código como el siguiente.

let textarea = document.getElementById("miTextarea");

// entonces cambias el valor del textarea:
textarea.value = "Nuevo valor";

// Ahora disparas un evento 'input' manualmente
textarea.dispatchEvent(new Event('input', {
    'bubbles': true,
    'cancelable': true
}));

El tipo de evento que se ha lanzado es un evento 'input' pero podrías perfectamente hacer un evento 'change'. O si estás en un componente posiblemente tendría sentido levantar un evento personalizado "custom event". Todo depende de la lógica que necesites para que tu aplicación se comporte como deba ;)

Miguel Angel
3280 145 214 17