Cuando el formulario no tiene definido un valor para el atributo
action
, el procesamiento de los datos contenidos en los campos que se encuentran dentro de este, se realiza en la misma página, recargándose la ventana.
Lo que necesitas es cancelar el envío, ya sea mediante un retorno del valor
booleano false
(
return false
) o el uso del método
.preventDefault()
. Una vez hecho esto, en la función puedes añadir la línea de redireccionamiento.
Puedes hacerlo trabajando
inline (insertando código JavaScript en los elementos HTML, forma obsoleta de trabajar) y retornando el valor
false
:
Código HTML:
Ver original<form onsubmit="return f1(document.forms[0]['c2'].value)"> <input type="text" value="" placeholder="nombre restaurante" required> <input type="text" value="" name="c2" placeholder="localidad" required> <input type="submit" value="Buscar" />
Código Javascript
:
Ver originalfunction f1(info){
var provincia;
switch(info) {
case "gran canaria":
provincia='gran-canaria';
break;
case "a coruña":
provincia='a-coruna';
break;
case "illes balears":
provincia='illes-balears';
break;
default:
provincia=info;
}
location.href = "http://es.search.yahoo.com/search?p=" + provincia;
return false;
}
O mediante métodos que registran funciones
escuchadoras de eventos (forma moderna y recomendada de trabajar):
Código HTML:
Ver original <input type="text" value="" placeholder="nombre restaurante" required> <input type="text" value="" name="c2" placeholder="localidad" required> <input type="submit" value="Buscar" />
Código Javascript
:
Ver originaldocument.addEventListener("submit", function(event){
event.preventDefault();
f1(document.forms[0]['c2'].value);
});
function f1(info){
var provincia;
switch(info) {
case "gran canaria":
provincia='gran-canaria';
break;
case "a coruña":
provincia='a-coruna';
break;
case "illes balears":
provincia='illes-balears';
break;
default:
provincia=info;
}
location.href = "http://es.search.yahoo.com/search?p=" + provincia;
}