Formulario

efra2010 · #1 (**permalink**) 17/06/2011, 21:43

Hola;

Me gustaría saber de qué forma se puede hacer una lista desplegable con un botón abajo de esa lista que me direccione a una página según la opción que haya escogido.

De antemano muchas gracias.

luciio · #2 (**permalink**) 17/06/2011, 23:11

Esto es con php, necesitas un archivo con un formulario y los campos necesarios cada uno con una variable(URL). ese formulario te dirige a otro archivo que captura la variable y por medio de header redirect te redirecciona, es muy sencillo, date una vuelta por el foro de PHP o google algo sobre formularios, Saludos !

abimaelrc · #3 (**permalink**) 18/06/2011, 00:12

Se podría usar javascript para modificar el valor del action cuando se seleccione algo. Algo así

Código PHP:

  <html>
<head>
<script type="text/javascript">
window.onload = function(){
    document.getElementById('foo').onsubmit = function(){
        var obj = document.getElementById('changeFoo');
        this.action = obj.options[obj.options.selectedIndex].value;
    };
}
</script>
</head>
<body>
<form id="foo" action="#">
    <select id="changeFoo">
    <option value="foo.html">foo</option>
    <option value="bar.html">bar</option>
    <option value="baz.html">baz</option>
</select>
<input type="submit" />
</form>
</body>
</html>

efra2010 · #4 (**permalink**) 20/06/2011, 23:25

Hola;

Tengo una duda y es la siguiente: ¿dónde coloco el enlace para que vaya a la página según la opción?
Ejemplo:
Si elijo la opción 1 y al pulsar el botón ir (botón ubicado abajo de la lista) vaya a www.misitio.com/opcion1
si elijo la opción 2 y al pulsar el botón ir vaya a www.misitio.com/opcion2
y así sucesivamente.

De antemano muchas gracias.

Bolsomaniaco · #5 (**permalink**) 22/06/2011, 12:58

Cita:

Iniciado por abimaelrc

Se podría usar javascript para modificar el valor del action cuando se seleccione algo. Algo así

Código PHP:

  <form id="foo" action="#">

    <select id="changeFoo">

    <option value="foo.html">foo</option>

    <option value="bar.html">bar</option>

    <option value="baz.html">baz</option>

</select>

<input type="submit" />

</form>

Tomando este ejemplo, donde dice "foo.htm","bar.html" y "baz.html" es donde tu tendrias que poner las direcciones de tus webs. Obviamente cada una es la que despliega o es opción del menu.

Y donde dice <input type="submit" /> esa es la accion que hará que dando click en el boton que visualizarás te lleve a la web "foo.htm","bar.html" y "baz.html".

Saludos!

caricatos · #6 (**permalink**) 22/06/2011, 18:23

Hola:

Resumiendo un poco:

Código:

this.action = obj.options[obj.options.selectedIndex].value;

equivale a:

Código:

this.action = obj.value;

Por cierto, se puede evitar la dependencia de javascript con un lenguaje en el servidor... por ejemplo el action con destino a ir.php y dándole un nombre al select: name="destino"... y "ir.php" con el código:

Código:

<?php
header("Location: ".$_GET["destino"]);
?>

Saludos

abimaelrc · #7 (**permalink**) 22/06/2011, 18:29

Cita:

Iniciado por caricatos

equivale a:

Código:

this.action = obj.value;

Ups, es verdad, es en lo que me acostumbro a trabajar nuevamente con javascript

Gracias por la corrección

caricatos · #8 (**permalink**) 22/06/2011, 18:55

Cita:

Iniciado por abimaelrc

...Gracias por la corrección

No se trata de un error, sino una simplificación...

Saludos

efra2010 · #9 (**permalink**) 22/06/2011, 22:52

Gracias a todos, lo voy a probar y les comento cómo me fué.

Mil gracias a todos.