PHP - Cambiar cabecera menú al realizar selección

Pos: 793

Val: 6

Cambiar cabecera menú al realizar selección

Publicado por unexes (124 intervenciones) el 30/03/2013 21:13:55

Hola a tos@s.

Empezare diciendo que la página funciona bien excepto que ahora quiero que me haga algo nuevo y es lo que no consigo hacer.
Vereis tengo un menu tipo acordeon hecho con Jquery se compone de varias cabeceras y dentro de cada una de ellas hay varios selects y checkbox, lo que quiero es que al cambiar lo seleccionado en uno de los selects la cabecera me cambie, me esplico en dicho select por defecto al entrar esta seleccionado "todas las ciudades" y la cabecera pone "Seleccione la Ciudad", quiero que al seleccionar una ciudad me cambie la cabecera por la de "Cambiar Ciudad" y viceversa..
Tal como esta el código ahora lo hace pero me obliga para ver el cambio a una vez seleccionada una ciudad refrescar la página manualmente pulsando por ejemplo "F5" si no la refresco no se realiza el cambio.
Este es mi código reducido, por supuesto todo esto esta dentro de un form y la "$_SESSION["Ciudad"]" obtiene su valor correctamente por eso la página funciona bien excepto que la cabecera no me cambia hasta que refresco la página manualmente.
Un saludo y gracias.

<div id="accordion">

<?php

    if ($_SESSION["Ciudad"] == "Todas las ciudades") {

         echo '<h3>Seleccione la Ciudad<br><img src="Imagenes/Barra.gif" width="160" height="2"></h3>';

       }else{

         echo '<h3>Cambiar Ciudad<br><img src="Imagenes/Barra2.gif" width="142" height="2"></h3>';

?>

	<div>

    <table width="185" height="30" border="0" cellspacing="5">

<tr><td align="left">

    <select name="selciudad" id="selciudad" class="Guias3" onChange="cargarContenido('ContenidoEscortsChicas.php')">

    <option value="Todas las ciudades" selected>&nbsp;Todas las ciudades&nbsp;&nbsp;&nbsp;</option>

    <option value="<?php echo $_SESSION["Ciudad"]; ?>" selected>&nbsp;&nbsp;<?php echo $_SESSION["Ciudad"]; ?></option>

<?php

    $tablaciudad = mysql_query("SELECT * FROM provincias  ORDER BY Provincia ASC");

    while ($registrociudad  = mysql_fetch_array($tablaciudad ))

        if (isset($_SESSION["Ciudad"])<> '-1')

           echo "<option value='".$registrociudad['Provincia']."' selected>&nbsp;&nbsp;".$_SESSION["Ciudad"]."</option>";

       }else{

          echo "<option value='".$registrociudad['Provincia']."' >&nbsp;&nbsp;".$registrociudad['Provincia']."</option>";      }

    mysql_free_result($tablaciudad);

?>

</select>

</td></tr></table>

</div>

Valora esta pregunta

Me gusta: Está pregunta es útil y esta clara

No me gusta: Está pregunta no esta clara o no es útil

Responder

Pos: 1

Val: 3.943

Cambiar cabecera menú al realizar selección

Publicado por xve (6935 intervenciones) el 31/03/2013 11:06:39

Hola Unexes, para que te realice el cambio sin actualizar la pagina tienes que hacerlo con javascript y/o jquery... lo que no se ver, es donde tienes el código de javascript.
Revisa este código, te servirá... http://www.lawebdelprogramador.com/codigo/JQuery/2308-Ejemplo_de_utilizar_jquery_con_un_select.html

Una pregunta aparte de tu problema... que editor utilizas para programar tus paginas web? es muy difícil de seguir el código por lo mal tabulado que lo deja.

Saludos

Valora esta respuesta

Me gusta: Está respuesta es útil y esta clara

No me gusta: Está respuesta no esta clara o no es útil

Comentar

Pos: 793

Val: 6

Cambiar cabecera menú al realizar selección

Publicado por unexes (124 intervenciones) el 31/03/2013 13:40:31

Hola xve
Empezare por el final utilizo el DeamWeaver CS6, perdona por la tabulación del código, pero es posible que sea un problema mio, ya que al realizar los cambios para las pruebas entre el copiar y pegar y cosas que añado y quito el código se queda hecho unos zorros, luego cuando funciona ya lo arreglo, a partir de ahora cuando solicite ayuda me preocupare de que este bien tabulado.

En el select en el evento onChange="cargarContenido('ContenidoEscortsChicas.php')"
utilizo el siguiente codigo javascript::

<script type='text/javascript'>

function cargarContenido(pagina)

        if(parseInt($("#PreMin").val())>parseInt($("#PreMax").val()))

            $("#PreMin").val($("#PreMax").val());

        if(parseInt($("#EdadMin").val())>parseInt($("#EdadMax").val()))

            $("#EdadMin").val($("#EdadMax").val());

		if(parseInt($("#EstaMin").val())>parseInt($("#EstaMax").val()))

            $("#EstaMin").val($("#EstaMax").val());

		if(parseInt($("#PesoMin").val())>parseInt($("#PesoMax").val()))

            $("#PesoMin").val($("#PesoMax").val());

    $("#contenido").html("<img src='loadingbar-green2.gif' class='clock' border='0'>");

    $("#contenido").load(pagina, $("#filtrar").serialize());

</script>

xve estoy revisando el código que me aconsejaste, pero no se como adaptarlo para lo que yo necesito ya que el select me funciona perfectamente el problema es que al cambiar de "todas las ciudades" a una ciudad enconcreto (o viceversa) no me cambia el titulo que aparece en la cabecera del menú acordeón, para que cambie tengo que pulsar F5.

A ver si este javascript que pongo puedo utilizarlo modificandolo para el fín que busco, Gracias por todo.

Valora esta respuesta

Comentar

Pos: 1

Val: 3.943

Cambiar cabecera menú al realizar selección

Publicado por xve (6935 intervenciones) el 01/04/2013 09:47:43

Gracias por comentarlo unexes...

Sobre tu problema, lo que yo aria es poner un id en tu texto, algo así:

echo '<h3><span id="textoSeleccion">Seleccione la Ciudad</span><br>...

Luego, desde el javascript, dependiendo de la selección, puedes cambiar dicho texto, algo así:

document.GetElementById("textoSeleccion").innrHTML="Cambiar Ciudad";

Coméntanos, si te sirve ok?

Valora esta respuesta

Comentar

Pos: 793

Val: 6

Cambiar cabecera menú al realizar selección

Publicado por unexes (124 intervenciones) el 01/04/2013 11:51:03

xve, No me funciona , pero a lo mejor es que lo estoy haciendo mal, la parte donde pongo el id= lo tengo claro y así lo he hecho:

<?php

    if ($_SESSION["Ciudad"] == "Todas las ciudades") {

         echo '<h3><span id="textoSeleccion">Seleccione la Ciudad</span><br><img src="Imagenes/Barra.gif" width="160" height="2"></h3>';

       }else{

         echo '<h3><span id="textoSeleccion">Cambiar la Ciudad</span><br><img src="Imagenes/Barra2.gif" width="142" height="2"></h3>';

?>

En la parte del javascript he intentado de mil maneras hacer cambios en el mismo añadiendo lo que me comentaste,

document.GetElementById("textoSeleccion").innrHTML="Cambiar Ciudad";

y probando cosas de mi propia cosecha pero lo unico que he conseguido es que deje de seleccionarme la ciudad y la página deje de funcionar correctamente y por supuesto no me cambia la cabecera del menu que es lo que necesito.
¿Que estoy haciendo mal con el código que me has comentado?
Un saludo y gracias por tu ayuda.

Valora esta respuesta

Comentar

Pos: 1

Val: 3.943

Cambiar cabecera menú al realizar selección

Publicado por xve (6935 intervenciones) el 01/04/2013 12:51:24

unexes, mil perdones, puse un error, no es innrHTML, sino innerHTML...
No te da error el Dreamweaver? prueba con Chrome y las Developers Tools (F12) ahi veras todos los errores de JavaScript.

Valora esta respuesta

Comentar

Pos: 793

Val: 6

Cambiar cabecera menú al realizar selección

Publicado por Unexes (124 intervenciones) el 01/04/2013 13:48:09

xve despues de enviarte el anterior comentario me di cuenta del error que me indicas y lo corregi pero no consigo hacerlo funcionar he probado al azar varias cosas y para que las veas he reducido el javascript y pongo algunas de ellas comentadas, ninguna de ellas funciona.

<script type='text/javascript'>

function cargarContenido(pagina)

       	//document.GetElementById("textoSeleccion").innerHTML="Cambiar Ciudad";// no funciona

	//$("#contenido").document.GetElementById("textoSeleccion").innerHTML="Cambiar Ciudad";//No funciona

	//$("#contenido").document.GetElementById("textoSeleccion"), $("#accordion").innerHTML="Cambiar Ciudad";//No funciona

// etc, etc, etc....

    $("#contenido").html("<img src='loadingbar-green2.gif' class='clock' border='0'>");

    $("#contenido").load(pagina, $("#filtrar").serialize());

</script>

Ninguna de las que he probado funciona, en todas ellas al incluirlas en el javascript el select sigue dejandome seleccionar otra ciudad pero no la cambia realmente con lo cual la página no funciona y tampoco me cambia la cabecera.
Se que estoy a un paso de lograrlo pero no veo como hacerlo.
Un saludo y gracias por el tiempo que me dedicas a ayudarme.

Valora esta respuesta

Comentar

Pos: 1

Val: 3.943

Cambiar cabecera menú al realizar selección

Publicado por xve (6935 intervenciones) el 02/04/2013 08:15:07

Unexes, creo que te estas liando...
document.GetElementById(...) hace referencia a un identificador, y $("#...") también hace referencia a un identificador, por lo que no los puedes juntar... o utilizas javascript o utilizas jquery, pero no puedes utilizar los dos en una misma linea.

Prueba así:

document.GetElementById("textoSeleccion").innerHTML="Cambiar Ciudad";

o así:

$("#textoSeleccion").html("Cambiar Ciudad");

Espero que ahora te funcione... coméntanos, ok?

Valora esta respuesta

Comentar

Pos: 793

Val: 6

Cambiar cabecera menú al realizar selección

Publicado por Unexes (124 intervenciones) el 02/04/2013 08:50:22

xve Ya empieza a funcionar a medias.
Te comento como veras la primera de las opciones ya la habia probado es una de las que esta comentada en la nota anterior y que no funcionaba, y en el resto de opciones ya estaba bastante liado y no sabia que es lo que me hacia, ya llegue entre tanta prueba a ponerlas un poco al azar.
Lo de funcionar a medias es porque ahora si selecciono una ciudad me cambia correctamente la cabecera y me pone lo de "Cambiar ciudad" pero necesito que funcione tambien en viceversa osea que si selecciono "Todas las ciudades" me ponga "Seleccione la ciudad".
Estoy intentando algo como esto pero de momento sigue funcionando a medias, solo funciona cuando selecciono una ciudad y no vuelve a su cabecera original cuando selecciono todas las ciudades.
Un saludo y muchas gracias.

if($("#textoSeleccion")=="Todas las ciudades")

$("#textoSeleccion").html("Seleccione la ciudad");

}else{

$("#textoSeleccion").html("Cambiar Ciudad");

Valora esta respuesta

Comentar

Pos: 1

Val: 3.943

Cambiar cabecera menú al realizar selección

Publicado por xve (6935 intervenciones) el 03/04/2013 07:09:06

Hola Unexes, para coger el valor tienes que utilizar $("#textoSeleccion").val().. prueba así:

if($("#textoSeleccion").val()=="Todas las ciudades")

...

Coméntanos, ok?

Valora esta respuesta

Comentar

Pos: 793

Val: 6

Cambiar cabecera menú al realizar selección

Publicado por Unexes (124 intervenciones) el 03/04/2013 08:29:55

xve. Ya funciona perfectamente al margen del cambio que me indicaste solo tuve que sustituir en la primera linea (#textoSeleccion) por (#selciudad) por lo tanto a quedado así:

if($("#selciudad").val()=="Todas las ciudades")

$("#textoSeleccion").html("Seleccione la ciudad");

}else{

$("#textoSeleccion").html("Cambiar Ciudad");

Muchas gracias por tu ayuda.
Un saludo.

Valora esta respuesta

Comentar

Pos: 1

Val: 3.943

Cambiar cabecera menú al realizar selección

Publicado por xve (6935 intervenciones) el 03/04/2013 10:29:17

Gracias por comentarlo Unexes!!!

Valora esta respuesta

Comentar

Varios botones en un formulario

Buenas prácticas para programar en PHP