Ocultar y mostrar respuestas de un foro con div

[jomafer]

Saludos:

Estaría muy agradecido si me pudiérais echar una mano con una duda que me ha surgido. No soy mucho de escribir, puesto que suelo buscar antes respuesta de la forma que sea posible, pero ante esta duda, no consigo resolverla.

Mediante MySQL debo traer mensajes desde una base de datos. Estos mensajes pertenecen a un foro, y por tanto, hay post iniciales y post de respuesta, de una forma jerárquica. Está organizado en la base de datos de la forma:

id del post \\ padre

Si el padre es 0, se refiere a un post inicial. Si no lo es, en padre va el id del post que sea su padre.

Me piden que los post de respuesta no se muestren, excepto si pulso en una imagen que acompaña a cada post padre.

No es problema de Ajax ni Javascript (está dominado). Es problema de PHP, que al haber utilizado una función recursiva, no me funciona bien ocultar las respuestas en div con style="display:none".

Esta es mi funcion:

Código PHP:

mostrarAnalisisTextual(0);
 
function mostrarAnalisisTextual($padre)
{
  // La consulta esta ordenada
  $consult= "SELECT id,parent FROM mdl_forum_posts WHERE parent = $padre";
  [[[Conecto a BBDD]]
  
  while ($row = mysql_fetch_array($result, MYSQL_NUM))
  { 
     if($row[1]==0) // Si es un post inicial
     {
        echo "AQUI VA EL FORMATO DEL POST INICIAL Y VA ACOMPAÑADO DE UNA IMAGEN CON -->onClick= "cargaContenidoRespuestas('.$row[0].')"/>
 
[B]INTUYO QUE AQUI DEBO PONER EL DIV PARA OCULTAR LAS RESPUESTAS[/B]
[B]echo '<div id="contenedorRespuesta'.$row[0].'" style="display:none">';[/B]
        
     }
     else // Si no es un post inicial
     {
        echo "AQUI VA EL FORMATO DE LOS POSTS DE RESPUESTA";
     }
  }
  mostrarAnalisisTextual($row[0]);
  [B]</div>[/B]
}
 

En resumen, sabríais ¿Dónde tengo que poner las etiquetas de inicio y fin???

Muchísimas gracias de antemano!

[jomafer]

Por si resulta confuso, tengo esto:

+ POST INICIAL
----- POST RESPUESTA
----- POST RESPUESTA
--------- POST RESPUESTA
+POST INICIAL

El simbolo + es una imagen, quiero que al pulsar ese + se desplieguen todas las respuestas de cada post inicial. En la función he puesto el codigo mucho más corto y leve de lo que es, para mostrar la idea principal. Si faltan comillas o algo, es por la adaptación que os hice, no porque esté mal, ya que me funciona a la perfección.

Gracias!

[memoadian]

que yo sepa php es lado del servidor por lo que solo te imprime contenido y nada tiene que ver con que si funciona con display none o cualquier regla css, o sea que si es problema de javascript si no oculta o no muestra etc.

luego usas el html mezclado con el php, por lo que la situacion se vuelve confusa y puede haber más errores.

conclusión, el problema es javascript, y la funcion cargaContenidoRespuestas

[jomafer]

Antetodo, gracias por tu respuesta. Mira, te comento. Por ahora lo que tengo realizado es lo siguiente: Muestro todos los mensajes, solo que en cada celda se muestra el titulo, y oculto el contenido del mensaje. Al pulsar al +, se despliega en esa misma celda el contenido del mensaje.

Es decir:
__________________
+ Titulo del mensaje |
__________________|

Al pulsar el mas:

__________________
+ Titulo del mensaje |
Contenido del msj |
_________________ |

Esto lo consegui metiendo a la hora de mostrar el contenido del mensaje, un div con style display none. Pero con esa informacion si me sale, y con las respuestas no :S por eso pedía a ver si me pudiérais orientar sobre como poner los div para que funcione. Muchas gracias

[GatorV]

Ya te lo dijo memoadian, ese no es problema de PHP, es problema de tu markup y Javascript, debes de imprimir todas las respuestas en un div que puedas mostrar ocultar con Javascript.

[jomafer]

Muchísimas gracias. Perdonad mi ignorancia, pero pensaba que el atributo display era de PHP y no de Javascript. Aunque mi duda es más elemental y básica:

si yo hago en textual.php:

<div id="hola" style="display:none">
echo "caracola";
</div>

¿Por qué me muestra caracola si está en display none? Es que ese es mi problema, que sigue mostrando las respuestas aunque las muestre en un div de ese tipo.

Sin embargo, funciona bien si lo hago así:

echo '<div id="contenedorRespuesta" style="display:none">'.$row[3].'</div>

$row[3] es el contenido del mensaje e inicialmente está oculto.

Eso es lo que quiero con todo este tocho de código (son las respuestas), pero no me funciona:

Código PHP:

echo '<tr><td align="center"><img src="'.$CFG->wwwroot.'/pix/t/switch_plus.gif" onClick="cargaContenidoRespuestas('.$row[0].')"/></td><td bgcolor=#FFFAF2><font color=#4518B4><b>'.$prefix.$row[2].'</b></font><div id="contenedorRespuesta'.$row[0].'" style="display:none">'.$row[3].'</div></td>';
        echo '<td>&nbsp<a href ="'.$CFG->wwwroot.'/user/view.php?id='.$row[1].'&course='.$idCurso.'">';
    
        // Asignacion de las imagenes en miniatura
        if($picture[$row[1]]==0) // Si no tiene imagen se le asigna por defecto
          echo '<img align="absmiddle" src="'.$CFG->wwwroot.'/pix/u/f2.png"/>';
        else 
          echo '<img align="absmiddle" src="'.$CFG->wwwroot.'/user/pix.php/'.$row[1].'/f2.jpg"/>';
        
        echo '</a> <a href ="'.$CFG->wwwroot.'/user/view.php?id='.$row[1].'&course='.$idCurso.'">'.$firstname[$row[1]].' '.$lastname[$row[1]].'</a></td>';
        echo '<td align="center">&nbsp'.date('D, j \d\e M \d\e Y, H:i', $row[4]).'</tr>';
 

y esta es mi funcion en javascript:

Código Javascript:

function cargaContenidoRespuestas(idPost)
{
 
  var contenedorRespuesta=document.getElementById("contenedorRespuesta"+idPost);
  var ajax=nuevoAjax();
  
  if(contenedorRespuesta.style.display == "") contenedorRespuesta.style.display = "none";
  else contenedorRespuesta.style.display = "";
  
  ajax.onreadystatechange=function()
  {
    if (ajax.readyState==4)
    {
      contenedorRespuesta.innerHTML = ajax.responseText;
    }
    else
      contenedorRespuesta.innerHTML = "<br>Cargando...<br><br>";
  }
  ajax.send(null);
}
 

ese codigo de arriba me funciona para ocultar y mostrar el contenido del mensaje al pulsar el boton +.


Gracias y disculpad las molestias

[dleal100]

diablos... o_o

[jomafer]

esto es exactamente lo que quiero.

http://www.quizzpot.com/demos/extjs/tree/tree-ajax.html

pero con un foro...

[jomafer]

esto es lo que tengo:



y lo que querria es que las respuestas encuadradas en rojo no se muestren hasta que no pulse el botón +. Gracias y disculpad las molestias

[jomafer]

La función recursiva para mostrar el arbol jerarquicamente la saque de aqui (pondré mi agradecimiento en el proyecto):

http://www.forosdelweb.com/wiki/PHP:%C2%BFC%C3%B3mo_crear_un_%C3%A1rbol_jer%C3%A1r quico_a_partir_de_una_tabla_en_la_DB%3F

[jomafer]

Saludos. Finalmente he conseguido mostrar la respuesta al pulsar el boton mas de cada post inicial.

El problema es que asigno cada respuesta como <tr id=padre> (pseudocodigo).

Por tanto, al tener varios hijos, desde el padre solo se me abre uno de ellos, ya que hago: onclick(id) (id es la id del post actual, es decir, como este trozo solo lo ejecuta el codigo padre, id hace referencia a éste).

Lo suyo sería poner como argumento de onclick la id de cada hijo e identificar a los post hijos no como el id del padre, sino como id propio. Pero no se de que forma puedo hacerlo.

Gracias

[memoadian]

podrias usar un ciclo para ir recorriendo los id de todos los hijos.

[jomafer]

Sí, pero ¿como se cargan todos los id de los hijos desde un solo evento en Javascript?

por ejemplo si un padre tiene 3 hijos con id=4,5,6 y otro tiene 8 hijos...¿como le paso eso a Ajax y que me lo abra todo a la vez desde el evento del padre?

Como ya te digo ahora mismo tengo a cada hijo de la forma: <tr id=IDPADRE>

y en el padre el evento onclick="abreHijo(IDPROPIA)".

y claro...así lo que hace es abrirme una sola respuesta por padre, ya que supongo que al haber dos hijos del mismo padre, se sustituyen las id de las tr.

Lo lógico sería meter a todos los hijos dentro de un div, que inicialmente está oculto, y dependiendo del evento, se muestren o se oculten con style display, pero ya te repito que me quedo atrancado a la hora de mostrar todos los hijos.

Muchísimas gracias de verdad, sé lo que es dar sin recibir nada a cambio (aunque sea Karma) :D

[jomafer]

Lo ideal sería que si un numero de contenedores tienen un id comun, que hagan todos lo mismo con una accion que llame a ese id...pero ¿esto no se puede no?

[memoadian]

se supone que el id de un elemento es unico, por lo que es un error llamar a dos elementos con el mismo id, quizas fuera más facil esto con jquery pues asi podrias llamar a todos los hijos de un elemento padre, obvio tambin se puede con javascript puro y duro pero no soy muy ducho.

la idea del for o ciclo es asignarles id dinámicos como id="hijo1"

Código Javascript:

cargar la funcion cargaContenidoRespuestas(idhijo)
for (i=0; i<=10; i++)//recorremos el numero de hijos
{
    cargaContenidoRespuestas('hijo'+i);//llamamos a la funcion para todos los hijos
}
 

es un burdo código pero es lo que se me ocurre.

[jomafer]

Muy buena tu idea, pero ese for tendría que hacer referencia a un solo elemento. Es decir:

<img src="" onClick="for($i=0;$i<10;$i++) { cargaContenidoRespuestas('hijo'+$i) }" />

ya que el simbolo solo lo dispone el padre, es decir:

+ padre

al pulsar el mas

+ padre
---- hijo 1
---- hijo 2
------- hijo 2.1
---- hijo 3

[jomafer]

Saludos! ya casi lo he conseguido.

A ver, desde PHP hice otra consulta, que me da los id de los hijos para cada padre. Estos id los tengo metidos en un vector: $hijos[]. Mi pregunta es: ¿Se puede pasar este vector por el evento onclick:cargaContenidoRespuesta como argumento de dicha funcion?

Es decir, algo así, para luego desde Javascript acceder a los elementos del vector y cargarlos en Ajax.

onclick:"cargaContenidoRespuestas('.$hijos.')

He leido por los foros que hay que pasar los elementos uno a uno, y en otro sitio leí que se puede realizar con la función implode, pero hablan de arrays, y lo mío, aunque técnicamente es un array, no he utilizado array para crearlo.

Gracias y disculpad mi ignorancia.