Una de las cosas que más nos piden es crear una lista de preguntas frecuentes. Esto se puede hacer de manera sencilla, creando una lista con un campo pregunta y otro respuesta.
Para finalmente presentarlo agrupado por pregunta.
Los principales problemas que los usuarios le ven a esta presentación es que sale el nombre del campo y que solo se puede desplegar la respuesta, si se hace clic sobre el nombre del campo "Pregunta".
Mientras que si se hace clic sobre el texto de la propia pregunta no hace nada.
Para solucionar esto, lo que suelo hacer es hacer una vista de datos, donde reconvierto la tabla que nos suele presentar por una serie de divs, quedando por ejemplo:
<div style="border-bottom:1px dotted black;">
<div id="{@ID}" style="font-weight:bold;font-size:16pt;cursor:pointer;" onclick="miPregunta(Respuesta{@ID})">
<xsl:value-of select="@Title"/>
</div>
<div id="Respuesta{@ID}" style="display:none;">
<xsl:value-of select="@Respuesta" disable-output-escaping="yes"/>
</div>
</div>
Lo único que nos faltaría es aplicar un JQuery que haga el efecto toogle sobre la respuesta. Hay muchas opciones, la mía suele ser:
<script>
function miPregunta() {
$(arguments[0]).toggle();
}
</script>
