[SOLUCIONADO] Mostrar div dinamico con javascript Problema curioso ?

[kukiko11]

que tal foreros? veran... para el sistema de comentarios que aplico en mi web estoy teniendo problemas a la hora de mostrar el formulario para poder responder a comentarios que haya en un post cualquiera. el formulario de respuesta se carga dinamicamente bajo los comentarios de forma oculta(style: display none) y pues mi intencion es que al hacer click en la opcion 'responder' que tienen los comentarios, se muestre el formulario mediante el metodo sho(), el script que estoy aplicando es el siguiente:

<!-- Mostrar formulario para responder a los comentarios -->
<script type="text/javascript">
$(document).ready(function(){
//si el mouse esta sobre la barra etiqueta, se muestran las mismas
$("#responder").click(function() {
$('#formulario-respuesta').show('slow');
return false;
});
});
</script>

el script funciona y muestra el formulario, el problema está en que solo funciona con el primer comentario de cualquier post, es decir; si presiono responder... en el comentario que le sigue, o en el siguiente a ese. etc etc, no funciona :C tendra algo que ver con que el div es dinamico? alguien tiene alguna idea de como podria solucionarlo?

[Alexis88]

Si es lo que creo, solo funciona con el primero porque estás colocando el mismo identificador a todos. Mejor utiliza una clase la cual sí puede repetirse. Y como son elementos creados dinámicamente, tienes que delegar el evento click al elemento que contiene a los botones o al documento mismo.

Un ejemplo suponiendo que los botones para comentar tienen por clase "activar" y los bloques de comentarios, la clase "comentario":

Código Javascript:

$(document).on("click", ".activar", function(){
    $(this).parent().find(".comentario").show("slow");
});
 

Y si quieres que con el mismo botón se oculte:

Código Javascript:

$(document).on("click", ".activar", function(){
    $(this).parent().find(".comentario").toggle("slow");
});
 

DEMO

Un saludo

[kukiko11]

Iniciado por Alexis88

Si es lo que creo, solo funciona con el primero porque estás colocando el mismo identificador a todos. Mejor utiliza una clase la cual sí puede repetirse. Y como son elementos creados dinámicamente, tienes que delegar el evento click al elemento que contiene a los botones o al documento mismo.

Un ejemplo suponiendo que los botones para comentar tienen por clase "activar" y los bloques de comentarios, la clase "comentario":

Código Javascript:

$(document).on("click", ".activar", function(){
    $(this).parent().find(".comentario").show("slow");
});
 

Y si quieres que con el mismo botón se oculte:

Código Javascript:

$(document).on("click", ".activar", function(){
    $(this).parent().find(".comentario").toggle("slow");
});
 

DEMO

Un saludo

aplicando las clases tienes razon, estas se repiten y me permite que el boton "responder" de todos los comentarios funcione, el detalle está ahora en que al clikearlo, sin importar cual sea, me muestrea el form de todos los comentarios

osea la idea es que: comentario donde se presione responder comentario al que le aparece un formulario abajo.

pero al ser el form cargado dinamicamente... cuando presiono responder en cualquiera de los comentarios; aparecen todos los formularios jaja un desmadre como imaginaras...

será que me estoy complicando mucho y simplemente pongo un solo form estatico para todos? me gustaba la idea de hacerlo como en un principio pero es que veo que esta jodido que aparezca solo el formulario correspondiente al comentario que se quiere responder, no se si habria una manera de poder hacerlo

[Alexis88]

¿Y si lo haces como en el demo?

Es el mismo código del ejemplo, por lo que, lo que mencionas, quizá se deba a la estructura de tu HTML.

[kukiko11]

no inventes no me habia fijado en esa demo... es justo lo que necesitaba lo aplique y salio perfecto! full gracias por la ayuda y paciencia man. Solucionado