Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: skan en 28 Octubre 2011, 02:35 am



Título: jQuery, Menús desplegables. Guardar posición?
Publicado por: skan en 28 Octubre 2011, 02:35 am
Hola


Imaginad que hago una lista expandible con jQuery,
ya sea con <div data-role="collapsible-set"> o con <ul data-role="listview"> y listas anidadas

Y acabamos seleccionando algún elemento que tiene un link a otra página.
Una página simple con una foto a pantalla completa y un botón para volver atrás.

¿Cómo hago para que al volver atrás se encuentre el menú desplegado exactamente del mismo modo?

La idea es usar jQuery para no tener que meterme con javascript ni cosas más complejas.

Acepto otras ideas.


Título: Re: jQuery, Menús desplegables. Guardar posición?
Publicado por: Kasi en 28 Octubre 2011, 20:33 pm
jQuery es javascript... xD

Puedes hacer que al seleccionar el link a esa página le pases una variable con la posición seleccionada del combo o lo que sea.
Al entrar en la página con el botón atrás, recuperas el valor de la página de la que vienes, y al pulsar el botón atrás, vuelves a enviar a la página origen la variable con el valor del combo a poner nuevamente.
Al cargar de nuevo la página original con el combo recuperas ese valor y pones el combo con el valor que le corresponde.

A groso modo creo que es lo mas fácil, espero que te sirva.


Un saludo


Título: Re: jQuery, Menús desplegables. Guardar posición?
Publicado por: skan en 29 Octubre 2011, 19:37 pm
Claro, pero ¿Cómo hago eso?
La idea general ya la tenía, preguntaba más bien por algún código concreto.


Título: Re: jQuery, Menús desplegables. Guardar posición?
Publicado por: Mr. Crowley en 30 Octubre 2011, 17:51 pm
Suponiendo que ya usted tiene el código del menú desplegable (imagino que es algún tipo de dropdown). El código que estoy colocando es simple y funciona para el ejemplo, pero no es la solución completa para usted; es únicamente para tomarlo como "guía".

Código
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <style type="text/css">
  3. #divMenu{
  4. background:#ff0000;
  5. }
  6. #divMenu a{
  7. float:left;
  8. background:#ff0000;
  9. padding:10px;
  10. }
  11. #divMenu a span{
  12. background:#ff0000;
  13. display:none;
  14. }
  15. </style>
  16. </head>
  17.  
  18. <?php
  19. $strMenu_Activo=(isset($_GET['lnkLink']))?$_GET['lnkLink']:'';
  20. ?>
  21. <div id="divMenu">
  22. <a id="lnkEmpresa" href="?lnkLink=lnkEmpresa">
  23. Empresa
  24. <span>
  25. Menu de la empresa
  26. </span>
  27. </a>
  28. <a id="lnkClientes" href="?lnkLink=lnkClientes">
  29. Clientes
  30. <span>
  31. Menu de clientes
  32. </span>
  33. </a>
  34. </div>
  35. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
  36. var strMenu_Activo='<?php echo $strMenu_Activo; ?>';
  37.  
  38. $(document).ready(function(){
  39. if(strMenu_Activo!=''){
  40. $('#'+strMenu_Activo+' span').css('display','block');
  41. }
  42. });
  43. </script>
  44. </body>
  45. </html>
  46.  

1. Con PHP se toma el contenido de la variable lnkLink y se almacena en una variable PHP llamada strMenu_Activo.
2. Abajo, en el código javascript, tenemos una variable de javascript llamada strMenu_Activo. En esta variable almacenamos exactamente el mismo valor que contiene la variable de PHP.
3. Si el contenido de strMenu_Activo (javascript) es diferente que '', entonces mostramos en bloque el elemento con el ID x (el ID es lo que recuperamos con PHP).

Mejor guarde el código en su máquina y colóquelo en Apache. Dele clic a cualquiera de las opciones para que vea como funciona. Es sólo una idea.

Si tiene el código del menú, páselo, talvez podamos adaptarlo.

Saludos!

EDITO:
Estoy de acuerdo con Kasi, de hecho el ejemplo está hecho pensando en la solución que propone, pero dudo que al volver atrás se logre recuperar el valor de la variable. Es decir, si estamos en index.php y le damos clic a loquesea.php?lnkLink=clientes, en la página que se abre el menú va a aparecer desplegado... pero si le damos clic al botón atrás (navegador) la variable va a estar vacía. Porqué? Porque estuvimos en index.php y no tenía ninguna variable :/ (un poco enredado jejejeje).

Solo en el caso del index.php es, probablemente, donde no le va a funcionar.


Título: Re: jQuery, Menús desplegables. Guardar posición?
Publicado por: skan en 30 Octubre 2011, 21:43 pm
Gracias,
lo probaré
y llamamé tú


Título: Re: jQuery, Menús desplegables. Guardar posición?
Publicado por: skan en 31 Octubre 2011, 12:03 pm
Hola otra vez

Lo que no he comentado en el mensaje inicial es que la idea es hacerlo para que funcione en Android, por eso quería intentar hacerlo integramente con jQuery, que sé que es compatible. Aunque, por comodidad, en un principio lo estaba probando directamente en el navegador del PC.

Si hiciese falta algo más creo que también le podría añadir javascript pero no sé si el PHP funcionaría.