Lanzar función al editar un grupo de inputs

[Ozone]

Hola a todos!,
tengo un código de este estilo:

Código HTML:

<form action="bla.php" method="post">

<div id="grupo1">
<input type="file" name="archivo 1">
<input type="text" name="texto 1">
</div>

<div id="grupo2">
<input type="file" name="archivo 2">
<input type="text" name="texto 2">
</div>

<input type="submit" value="Send">

</form> 

Lo que yo quiero es que onchange cualquier valor de un input del grupo 1 se ejecute X función. Probé poniendo <div id="grupo1" onchange="funcion()"> pero no funciona en Chrome... No se me hace práctico ponerle onchange a cada input, si hay una opción mejor sería genial...

¿Alguna idea?


Gracias!!

[IsaBelM]

usar el método getElementsByTagName() y addEventListener()

[Ozone]

Iniciado por IsaBelM

usar el método getElementsByTagName() y addEventListener()

Gracias!, estoy medio verde todavía en Javascript :) Probé algo así:

Código Javascript:

function load(){
var x = document.getElementsByTagName("input");
x.addEventListener("onChange", agregar, false);
}
document.addEventListener("DOMContentLoaded", load, false);
 

"agregar" es el nombre de la función. Pero no me funcionó... Le puse un alert a la función agregar y nada... ¿la estoy llamando mal?

Gracias por la ayuda!

[IsaBelM]

en el tipo de evento has puesto onChange, cuando ha de ser change

[Ozone]

Iniciado por IsaBelM

en el tipo de evento has puesto onChange, cuando ha de ser change

La consola me dice "x.addEventListener is not a function"... Alguna idea?

Gracias!

[IsaBelM]

con getElementsByTagName() lo que obtienes es una colecciones de los elementos, en este caso input, que hay en el documento. has de usar un ciclo para saber sobre que elemento se ha realizado la acción

for(var i = 0; x.length; i++) {
x[i].addEventListener("change", agregar, false);
}

[Ozone]

Perfecto, genial IsaBelM, gracias!
Una cosa más. Necesito tomar el id o name del input cuyo valor cambió (change) para mandarlo como parámetro de la función del eventListener... El tema de parámetro encontré como hacerlo, pero para obtener el name o id no se me ocurre como... Alguna idea?

Código Javascript:

function load(){
    var x = document.getElementsByTagName("input");
    for(var i = 0; x.length; i++) {
        x[i].addEventListener("change", function(){ agregar(parametro)}, false);
    }
}
document.addEventListener("DOMContentLoaded", load, false);
 

En donde dice parámetro tendría que ir el id o el name del input que está desencadenando el script.

Gracias!!

[IsaBelM]

this.id o this.name