jquery para ir a una url en el formulario enviado con los valores de campo agregados a la cadena url

Question

Soy bastante nuevo en jquery y creo que esto es simple pero estoy teniendo problemas y Google no parece estar ayudando ...

Lo que tengo es un formulario básico ...

<form>
First Name: < input type="text" name="firstName" id="firstName" />
Surname: < input type="text" name="surname" id="surname" />
<input type="submit" id="submit" value="submit"/>
</form>

Ahora, cuando se hace clic en enviar, quiero ir a una url, pero luego agregar los valores froms a la cadena url (pero no usar el método form = get) básicamente quiero que esto suceda

al hacer clic en enviar goto http://myurl.com/index.html?params=firstNamevalue*surnamevalue

He estado haciendo piruetas con el jQuery pero donde estoy hasta ahora es algo como esto ...

< script src="http://www.google.com/jsapi" type="text/javascript">< /script>
< script type="text/javascript">
    google.load("jquery", "1.3.1");
</script>

< script type="text/javascript">

var = firstName $("#firstName").val();
var = surname $("#surname").val();


$('#submit').click(function(){
  window.location = ???;
}); 
< /script>

espero que haya sido muy claro, ¡agradecería cualquier ayuda!

Andy

Answer 1

gracias a ambos por su ayuda en esto ...

No estoy seguro de si estaba haciendo algo mal con tus métodos o si no había descrito lo que tenía que hacer lo suficientemente bien ...

La solución al final para mí fue esta ...

el primer archivo contiene un formulario con method="get"

< form method="get" action="getParams.html">
First Name: < input type="text" name="firstName" id="firstName" />
Surname: < input type="text" name="surname" id="surname" />
< input type="submit" id="submit" value="submit"/>
< /form>

esto dirige a obtener params y como el método = obtener la url termina con getParams.html?firstname=""&surname=""

Luego, en la página getParams.html esto se usa simplemente para el formato (como lo necesito) de la url y redirigir ...

Usé jquery adjunto seguido de este complemento http: // projects.allmarkedup.com/jquery_url_parser/

con el js:

var firstName = jQuery.url.param("firstName");
var surname = jQuery.url.param("surname");
location.href = 'http://myOnlineMag/issue01.html?params=' + firstName + '*' + surname; 

extrae los valores que deseo que formen la URL como vars y luego los adjunta al final de mi URL. (Necesité estos en este formato específico; no puedo compartir un enlace hasta que los proyectos estén en funcionamiento, pero puedo publicar la próxima semana si lo desea).

Answer 2

jQuery serialize puede ayudar en un caso simple como el que usted describe:

$('#form').submit(function(){
  location.href = 'index.html'+$(this).serialize();
});

Answer 3

Tienes razón, casi.

var firstName = $("#firstName").val();
var surname = $("#surname").val();

location.href = "index.html?firstName=" + firstName + "&surname=" + surname

Por supuesto, podría crear una función que acepte una lista de pares clave / valor en un objeto y haga que esto sea genérico, pero se entiende la idea.

$('#submit').click( function() { 
location.href = "";
return false;
} );