input type=”submit”

input type=”submit”

La etiqueta <input> en HTML tiene como valor “submit” en su atributo type, input type=”submit” esto simboliza a un botón, este botón es más conocido como el botón de envío del formulario, que cuando presionas es enviada el contenido del formulario a la gente procesador.
En la actualidad con la llegada de HTML5 han sido agregado varios atributos nuevos a esta etiqueta estos atributos son los siguientes:

  • formnovalidate
  • formaction
  • formtarget
  • formmethod
  • formenctype

Estos atributos nuevos define y anula algunos parámetros vinculado sobre él formulario qué debe ser enviada. Así como también trae mejoras, como por ejemplo: Para facilitar más de un botón de envío en un mismo formulario, y cada botón debe ser diferente tipo de envío. Para que sea diferente cada botón de envío dependerá del atributo value y también de sus atributos.

Ejemplos

En este presente ejemplo tenemos un formulario <form> con dos campos de texto y un botón de envío submit, como usted podrá probar las funcionalidades en este ejemplo el botón de envío cuando es presionada, el formulario <form> es enviada automáticamente.

<form style="background-color: #3f6a9e;">
    <fieldset>
        <legend> Submit</legend>
        <p>Botón de envio: <br>
            <input type="text" placeholder="nomnre">
            <input type="text" placeholder="apellido">
        </p>
        <input type="submit">
    </fieldset>
</form>

Submit

Botón de envio:

Siguiendo con ejemplos de input type=”submit” tenemos un formulario con dos Campos de texto y dos botones de envío con distintas funcionalidades, el primer botón usa el valor por defecto de la etiqueta <form>, mientras el segundo botón elimina algunos atributos originales el envío del formulario es mediante el método GET y lo mas importante envía sin validar los datos.

<form style="background-color: #3f6a9e;">
    <fieldset>
        <legend> Submit</legend>
        <p>Botón de envio: <br>
            <input type="text" placeholder="nombre" required>
            <input type="text" placeholder="apellido" required>
        </p>
        <input type="submit" value="Enviar">
         <input type="submit" value="Enviar sin rellenar" formmethod="get" formnovalidate>
    </fieldset>
</form>

Submit

Botón de envio:


Nota: En este último ejemplo el primer botón no enviará hasta que sea rellenada los dos campos de texto, mientras que el segundo botón enviará el contenido del formulario por más que esté sin rellenar los dos campos de textos gracias al atributo GET, estos casos es muy útil para los usuarios que no deseen rellenar su información en dicho formulario al agente procesado (servidor).

vamos al inicio

¿Quieres aprender mas?, entonces también te puede interesar



Deja una respuesta

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