heredar event handlers

[xcars]

Saludos. Creanme que antes de escribir este post he buscado y buscado informacion, y no he podido encontrar nada, lo mas seguro es uqe talvez la forma en que lo estoy buscando o las palabras no son las adecuadas.

He hecho un par de funciones en JS para facilitarme algunas cosas, y pues mas que todo con el objetivo de aprender mas (pues facil me seria hacerlo con un framework, pero quiero aprender mas a fondo), entonces, tengo una funcion que agrega listeners a los id o tags que yo elija, y que la utilizo en este caso para hacer el efecto de resaltar una fila,columna o celda de otro color mientras pasa el mouse, etc.

Ademas, he hecho una funcion para adicionar filas o columnas a una tabla, y aqui esta el problema, utilizo clone para duplicar una fila (anteriormente lo hice tambien adicionandole hijos a los nodos), la cosa es que al insertar una fila nueva (que es el caso en el que me he quedado) los listeners no los tiene (solo en IE si), ahora bien, los listeners que agrego son de forma dinamica, es decir, hoy puede ser solo un mouseover/mouseout, en otra tabla puede ser mouseove/mouseout/click, en una tercera tabla solo el click, etc por lo tanto nose uqe eventos estan asociados a cada tabla (o bajo ese precepto quiero hacer la funcion) entonces nose si habra alguna manera de obtener los events handlers asociados a la fila (o celda) clonada, o de que otra manera pudiera hacer esto?

Por otro lado, cuando clono la fila o el elemento, el id y demas info quedan igual que al elemento de donde se origino, y debo de reemplazarlo por uno nuevo, como puedo lograr esto?


Nose que tan necesario sea poner el codigo, pero si lo necesitan aki dejo algunas porciones porque ya esta algo grandecito ejjee

esta es la funcion que agrega una fila

Código Javascript:

function iFila(Tabla) {
        var el = get(Tabla); //get es una funcion que tiene getElementById
        if (!el) return;
        var tblBody = el.tBodies[0];
        var newNode = tblBody.rows[0].cloneNode(true);
        tblBody.appendChild(newNode);
    }
 

[zerokilled]

[...] utilizo clone para duplicar una fila [...], la cosa es que al insertar una fila nueva [...] los listeners no los tiene.
[...]
Por otro lado, cuando clono la fila o el elemento, el id y demas info quedan igual que al elemento de donde se origino, y debo de reemplazarlo por uno nuevo, como puedo lograr esto?

depende como el listener se ha registrado. si el listener se ha registrado como atributo del elemento, cloneNode tambien clona los atributos; pero estoy seguro que no es tu caso. segun el estandar DOM Event, cloneNode no clona los eventos registrados con addEventListener como propiedad del elemento. lo que significa que al clonar un elemento tienes que registrar el listener. en adicion, para cambiar los valores de los atributos tienes dos modos: con la funcion setAttribute o considera el atributo como una propiedad del elemento y le asignas un nuevo valor. por ejemplo, element.id = "nuevo_id";.

[xcars]

Saludos y gracias por tu respuesta.
Efectivamente, al adicinoar los events handlers con addListener, al clonar no tengo los listeners, mi duda va orientada a que partamos de qeu no sabemos que listeners tiene asignado un elemento, entonces, hay que obtener ese listado del elemento a clonar para luego asignarselos al clon, y es lo que nose como hacer.
Gracias por tu respuesta

[zerokilled]

disculpa, me olvide comentar acerca de ese detalle. desgraciadamente no hay forma de determinar cuales eventos estan registrado en un elemento cuando se registran con addEventListener. a menos no he visto que el estandar DOM Event defina alguna forma. si se agregan como propiedades del elemento, se puede determinar en un bucle con una lista de los eventos que posiblemente tenga registrado. si devuelve una funcion, entonces es que tiene un evento.

[xcars]

Umm interesante.... tendre que pensar otra forma de hacer esto entonces.... porque llevar un control de que listeners tiene cada control sera demasiado engorroso.... voy a pensar que solucion tomar entonces.
Gracias

Iniciado por zerokilled

disculpa, me olvide comentar acerca de ese detalle. desgraciadamente no hay forma de determinar cuales eventos estan registrado en un elemento cuando se registran con addEventListener. a menos no he visto que el estandar DOM Event defina alguna forma. si se agregan como propiedades del elemento, se puede determinar en un bucle con una lista de los eventos que posiblemente tenga registrado. si devuelve una funcion, entonces es que tiene un evento.

[zerokilled]

hay ciertas cosas triviales que se pueden realizar en CSS y que emulan perfectamente los eventos mouseover y mouseout. por ejemplo, cambiar el fondo de un elemento, mostrar y esconder elementos, rollover de imagenes. de momento, la unica contra es que al menos iexplorer6 no es capaz de reproducir el efecto en otros elementos que no sean enlaces. especificamente estoy hablando de la pseudo-clase :hover.

ahora bien, no estoy tan claro de que es lo que exactamente quieres lograr, aparte de clonar los eventos. segun la explicacion que has hecho, cada celda, fila o tabla tienen una serie de eventos distintos a otras tablas. el concepto que no estoy seguro es si cada celda o fila que clonas es para agregarlo en la misma tabla. si es asi, tienes una solucion basada en el modelo de DOM Event. pero antes, te recomiendo que leas alguna referencia o tutorial acerca de las caracteristicas de DOM Event y su diferencia en iexplorer.

una solucion que me gusta usar mucho en situaciones donde una serie de elementos tendran el mismo evento es crear un listener que se registra en un elemento contenedor de dichos elementos. luego, con la ayuda del objeto evento -que se propaga por los elementos- determino en que elemento ocurrio el evento y procedo con el resto de la operacion si el elemento deseado coincide. en el siguiente tema, http://www.forosdelweb.com/showthread.php?p=3043623, demuestro un ejemplo de esta tecnica. te recomiendo que leas el tema completo para que entiendas la situacion.

[xcars]

Efectivamente zerokilled, es tal y como lo planteas, el clonador que estoy haciendo, aunque lo estoy aplicando para probarlo en una tabla, deberia de funcionarme con otros elementos basicos, o a lo mucho realizarle modificaciones para otros elementos.

Y si, si por ejemplo clonare o agregare una fila a tabla1, sera a esa misma tabla.

Me gusta mucho la idea que planteas, de agregar el listener a un contenedor general y luego este listener se encargue de realizar las tareas sobre sus elementos interiores, en mi caso de prueba, seria agregar el listener a la tabla y determinar luego donde ocurrio el evento dentro de la tabla, es asi como lo planteas?? de igual forma leere un poco mas sobre DOM Events... gracias por el apoyo

Iniciado por zerokilled

hay ciertas cosas triviales que se pueden realizar en CSS y que emulan perfectamente los eventos mouseover y mouseout. por ejemplo, cambiar el fondo de un elemento, mostrar y esconder elementos, rollover de imagenes. de momento, la unica contra es que al menos iexplorer6 no es capaz de reproducir el efecto en otros elementos que no sean enlaces. especificamente estoy hablando de la pseudo-clase :hover.

ahora bien, no estoy tan claro de que es lo que exactamente quieres lograr, aparte de clonar los eventos. segun la explicacion que has hecho, cada celda, fila o tabla tienen una serie de eventos distintos a otras tablas. el concepto que no estoy seguro es si cada celda o fila que clonas es para agregarlo en la misma tabla. si es asi, tienes una solucion basada en el modelo de DOM Event. pero antes, te recomiendo que leas alguna referencia o tutorial acerca de las caracteristicas de DOM Event y su diferencia en iexplorer.

una solucion que me gusta usar mucho en situaciones donde una serie de elementos tendran el mismo evento es crear un listener que se registra en un elemento contenedor de dichos elementos. luego, con la ayuda del objeto evento -que se propaga por los elementos- determino en que elemento ocurrio el evento y procedo con el resto de la operacion si el elemento deseado coincide. en el siguiente tema, http://www.forosdelweb.com/showthread.php?p=3043623, demuestro un ejemplo de esta tecnica. te recomiendo que leas el tema completo para que entiendas la situacion.

[zerokilled]

seria agregar el listener a la tabla y determinar luego donde ocurrio el evento dentro de la tabla, es asi como lo planteas??

es correcto...