El objetivo de este artículo es enviar unos datos por post a una página web utilizando Javascript. En realidad lo que vamos a hacer es enviar un formulario al pulsar un enlace de una página web. El formulario no se verá en la página, lo único que veremos es un enlace y al hacer clic, con javascript haremos que ese formulario se envíe, con lo que se mandarán los datos del formulario por POST a la página de destino del formulario.
El ejemplo es sencillo. Requiere de tres partes, el formulario, la función javascript para enviarlo y el enlace que se debe hacer clic para que se realice el envío.
El formulario con los datos a enviar por POST
Lo más cómodo es que, si queremos enviar datos por POST, creemos el formulario con los datos que se desea enviar. El formulario tendrá el atributo action dirigido a la página a la que queremos enviar los datos y el método de envío POST.
<form action="pagina_destino.php" method=post name="formulario1">
<input type="hidden" name="campo1" value="valor">
<input type="hidden" name="campo2" value="otroValor">
</form>
Como no queremos que se vea el formulario, sólo queremos enviar sus datos por POST, todos los campos del formulario son hidden, es decir, ocultos.
Función Javascript para enviar un formulario
La segunda parte es una función Javascript que ejecutaremos para enviar el formulario. Hace uso del método submit() asociado a los formularios.
function enviar_formulario(){
document.formulario1.submit()
}
</script>
Si nos fijamos, la función tiene una única sentencia que submite el formulario. Para ello se accede primero al formulario por el nombre que le hemos dado en el atributo name de la etiqueta <FORM> en el código HTML. El nombre del formulario era "formulario1". Así que esa instrucción hace un submit() del formulario1, que a su vez es una propiedad del objeto document de la página.
Enlace para enviar los datos por POST
Ahora, el objetivo del artículo es enviar unos datos por post al hacer clic en un enlace. Así que simplemente, enviando el formulario haremos llegar esos datos por post al destino. Por tanto, tenemos que construir un enlace que llame a la función javascript anterior.
<a href="javascript:enviar_formulario()">Enviar formulario</a>
Esto es muy sencillo. Simplemente se indica con javascript: que se debe ejecutar un código javascript al pulsar el enlace. El código javascript es una simple llamada a la función enviar_formulario().
El código completo de este ejemplo se puede ver aquí:
<head>
<title>Enviar formulario al pulsar un enlace</title>
<script>
function enviar_formulario(){
document.formulario1.submit()
}
</script>
</head>
<body>
<form action="pagina_destino.php" method=post name="formulario1">
<input type="hidden" name="campo1" value="valor">
<input type="hidden" name="campo2" value="otroValor">
</form>
<a href="javascript:enviar_formulario()">Enviar formulario</a>
</body>
</html>
Si quieres seguir aprendiendo con nosotros, puedes ingresar a nuestros
Cursos y Diplomados de Tecnología Web visita www.uneweb.edu.ve para más información
No hay comentarios:
Publicar un comentario