Enviar formularios con javascript – Utilizar una imagen para enviar formularios

En este tip cubrimos dos apartados. El primero es como enviar formularios utilizando javascript y complementa al segundo que tratará sobre como utilizar una imagen como botón de submit

Hoy estoy trabajando bastante con formularios, de ahí que me tome unos minutos para escribir algunos tips que creo pueden resultar útiles.

En este caso cubriremos como enviar formularios utilizando javascript y luego como utilizar una imagen para enviar los formularios.

Enviar formularios con javascript

Para enviar un formulario con javascript necesitamos identificarlo con un name.

 <form method="POST" action="" name="contactar" id="contactar" />

Luego simplemente accedemos al document, luego al formulario y a la acción submit().

 &ltp onclick="document.contactar.submit();">enviar!</p>

El ejemplo anterior serviría para utilizar una etiqueta de parágrafo para enviar el formulario.

Utilizar una imagen para enviar formularios

Como los más espavilados han notado no hay mayor secreto en este paso conociendo el paso anterior.

&ltimg src="path/to/image.png" onclick="document.contactar.submit();">

Aunque si queremos implementar validación podemos hacerlo llamado desde el evento onclick a la función de validación y en la función agregar

		if (error.length > 0) {
			document.getElementById('error').innerHTML = error;
			return false;
		}
		document.contactar_f.submit();

Y de esa forma conseguimos validar el formulario y al mismo tiempo utilizar una imagen para el proceso.
Como siempre, la validación es una parte importante de la programación web y por tanto es eficiente validar los formularios tanto en javascript como en php.

En javascript por usabilidad y velocidad y en php por seguridad.

Si apetece ya hablaremos de este tema un poco más extendido.


Así nos han encontrado!

  • enviar formulario javascript
  • enviar formulario con javascript

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *

Puedes usar las siguientes etiquetas y atributos HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="" cssfile="">