Menu desplegable Javascript PHP MySQL

[gfabiano]

Estimados:

Me podría alguien dar una mano con el siguiente problema. Gracias anticipadas.

Tengo un menu que cuando presiono sobre alguna de las categorias me despliega las subcategorias relacionadas. Cuando hago click sobre la subcategoria me actualiza y esa categoria que antes tenía desplegada mostrando las subcategorias contenidas en ella, está cerrada.

Como puedo hacer para que luego de haber hecho click sobre la subcategoria y actualizara la pagina siga viendo el mismo menu desplegado.


Aca va parte del codigo (sin las otras condiciones)


<?php

if ($pagina == '/notadepedido.php' . '?' . $_SERVER['QUERY_STRING']) {
$idcat = $_SERVER['QUERY_STRING'];
$idcategory = substr("$idcat", -1);

?>
<style type="text/css">
#menu { text-align: left;
font-size: 11px;
font-family: tahoma;
font-weight: bold;
}
#menu #cat { padding: 2px 0px 5px 5px; margin: 0px; }
#menu #cat a { color: #1C4176; }
#menu #cat li { display: none; }
#menu #cat li a { text-decoration: none; color: #A53C3C; }
</style>

<script type="text/javascript">
function desplegar( catNode )
{
var menu = document.getElementById( 'menu' );
var cats = menu.getElementsByTagName( 'UL' );
for( i=0; i<cats.length; i++ ) {
var items = cats[i].getElementsByTagName( 'LI' );
for( u=0; u<items.length; u++ ) {
if( cats[i] != catNode ) {
items[u].style.display = 'none';
} else {
items[u].style.display = 'block';
}
}
}
}
</script>

<!-- MENU DESPLEGABLE -->

<div id="menu">
<?php
require_once('Connections/cn.php');
mysql_select_db($database_cn, $cn);
//echo mysql_errno($cn) . ": " . mysql_error($cn). "\n";


$categorias = mysql_query( "SELECT * FROM categorias ORDER BY NombreCategoria ASC", $cn );

while ( $datos_categoria = mysql_fetch_array( $categorias ) ) {

$direccion=$datos_categoria['IdCategoria'];

$subcategorias = mysql_query( "SELECT * FROM subcategorias WHERE IdCategoria ='$idcategory' ORDER BY NombreSubcategoria ASC", $cn );

echo '<ul id="cat"><strong>•&nbsp;&nbsp;</strong><a href="javascript:void(0);" onclick="desplegar( this.parentNode );">'.$datos_categoria['NombreCategoria'].'</a>'."\n";

while ( $datos_subcategoria = mysql_fetch_array( $subcategorias ) ) {
echo "\t".'<li style="padding: 1px 0px 5px 5px; margin: 2px;">&raquo;&nbsp;<a href="'."notadepedido.php".'?'.$datos_subcategoria['IdSubcategoria'].'" TARGET="_self">'.$datos_subcategoria['NombreSubcategoria'].'</a></li>'."\n";
}

echo '</ul>'."\n";
}
?>

[zalito12]

Bueno, yo creo que la primera pregunta que te tienes que hacer es: ¿Es imprescindible actualizar la página?
Si por otra parte quieres cambiar de página manteniendo esos menús podrías enviar las variable por get. Pero si te pregunta nada más es referida a actualizar la página en la que te encuentras lo primero será ver si es imprescindible, obviando el caso de que alguien pulse F5 porque le apetezca que ahi ya no puedes hacer nada.

[IsaBelM]

lo primero es hacerte la misma pregunta que te hace zalito12, ya que no le veo sentido.

respondiendo al problema que planteas, supongo que IdSubcategoria te trae un número. no se bien como hacer la concatenación, pero la idea es esta

<li <?php echo $IdSubcategoria=="1"?" class=\"seleccionada\"":"";?> style="padding: 1px 0px 5px 5px; margin: 2px;">.......

en el css

#menu #cat li.seleccionada { display: block; }

[gfabiano]

Muchas gracias a ambos por su respuesta. Para aclarar un poco la situación este código es parte de un archivo que utilizo con un include dentro de otro PHP.
La cuestion es que si o si me actualiza la página, ya que a traves de la URL toma los parametros para mostrarle al usuario los productos que están dentro de la subcategoria que seleccionó del menú.

El tema es que al seleccionar el usuario una subcategoria, la página notadepedido.php se actualiza, y también se actualiza el archivo menu.php conjuntamente. Si se fijaron encaré el tema de poder tomar los valores que necesito desde la misma URL (GET) por eso utilizo la línea if ($pagina == '/notadepedido.php' . '?' . $_SERVER['QUERY_STRING']) para luego sacarle el ID que necesito con $idcat = $_SERVER['QUERY_STRING']; $idcategory = substr("$idcat", -1); siendo todo esto PHP.

Mi duda radica en como puedo hacer que luego de esa actualización de la página, el javascript me desplieque y muestre la categoria y subcategorias que el usuario veía al momento de hacer click sobre una de esas subcategorias.

Desde ya muchas gracias.

[IsaBelM]

prueba con esto

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
<head>
<meta http-equiv="Content-Type" content="application/xhtml; charset=utf-8" />
<title></title>
<style type="text/css">
#cont ul li {display: none;}
#cont ul.seleccionada li{display: block;}
#cont ul.oculto li{display: none;}
span {cursor: pointer;}
</style>

<script type="text/javascript">
function fnc(elem) {
var ul = document.getElementById('cont').getElementsByTagNa me('ul');
for(var i=0; i<ul.length; i++) {
if (ul[i] == elem) {
for(var j=0, li = ul[i].getElementsByTagName('li'); j<li.length; j++) {
li[j].style.display = 'block';
}
} else {
for(var j=0, li = ul[i].getElementsByTagName('li'); j<li.length; j++) {
li[j].style.display = 'none';
}
}
}
}
</script>
</head>
<body>

<?php
$idcategory = $_GET['param'];
?>

<div id="cont">

<ul <?php echo $idcategory=="l1"?"class=\"seleccionada\"":"class= \"oculto\"";?>><span onclick="fnc(this.parentNode)">listado1</span>
<li><a href="?param=l1">contenido1</a></li>
<li><a href="?param=l1">contenido2</a></li>
<li><a href="?param=l1">contenido3</a></li>
</ul>

<ul <?php echo $idcategory=="l2"?"class=\"seleccionada\"":"class= \"oculto\"";?>><span onclick="fnc(this.parentNode)">listado2</span>
<li><a href="?param=l2">contenido4</a></li>
<li><a href="?param=l2">contenido5</a></li>
<li><a href="?param=l2">contenido6</a></li>
</ul>

</div>

</body>
</html>

[gfabiano]

Muchas gracias por tu respuesta. He probado lo que me has enviado pero no es lo que busco, ya que no está relacionado el menú con los datos de la consulta SQL y además el javascript enviado depende de la acción de hacer click con el mouse para que se despliegue el menú.

Gracias nuevamente.