Elementos Internos de un "CPU"

Formulario en HTML

!!Formulario Digital!!

                                                                    

#Cuadro de texto

Se trata del elemento más utilizado en los formularios. En el caso más sencillo, se muestra un cuadro de texto vacío en el que el usuario puede escribir cualquier texto:

•  Ejemplo de etiqueta input (type=text)

A continuación se muestra el código HTML correspondiente al ejemplo anterior:

Nombre <br/>

<input type="text" name="nombre" value="" />

#Cuadro de contraseña
La única diferencia entre este control y el cuadro de texto normal es que el texto que el usuario escribe en un cuadro de contraseña no se ve en la pantalla. En su lugar, los 
  navegadores ocultan el texto utilizando asteriscos o círculos, por lo que es ideal para escribir contraseñas y otros datos sensibles. 

• Ejemplo de etiqueta input (type=password)

Contraseña <br/>
<input type="password" name="contrasena" value="" />

#Checkbox
Los checkbox o "casillas de verificación" son controles de formulario que permiten al usuario seleccionar y deseleccionar opciones individualmente. Aunque en ocasiones se muestran varios checkbox juntos, cada uno de ellos es completamente independiente del resto. Por este motivo, se utilizan cuando el usuario puede activar y desactivar varias opciones relacionadas pero no excluyentes.

• Ejemplo de etiqueta input (type=checkbox)

Puestos de trabajo buscados <br/>
<input name="puesto_directivo" type="checkbox" value="direccion"/> Dirección
<input name="puesto_tecnico" type="checkbox" value="tecnico"/> Técnico

<input name="puesto_empleado" type="checkbox" value="empleado"/> Empleado

#Radiobutton
Los control es de tipo radiobutton son similares a los controles de tipo checkbox, pero presentan una diferencia muy importante: son mutuamente excluyentes. Los radiobutton se utilizan cuando el usuario solamente puede escoger una opción entre las distintas opciones relacionadas que se le presentan. Cada vez que se selecciona una opción, automáticamente se deselecciona la otra opción que estaba seleccionaba.

Ejemplo de etiqueta input (type=radio)

Sexo <br/>
<input type="radio" name="sexo" value="hombre" checked="checked" /> Hombre
<input type="radio" name="sexo" value="mujer" /> Mujer

#Botón de envío de formulario

La mayoría de formularios dispone de un botón para enviar al servidor los datos introducidos por el usuario:   

 Ejemplo de etiqueta input (type=reset)





<input type="reset" name="limpiar" value="Borrar datos del formulario" />


#Ficheros adjuntos
Los formularios también permiten adjuntar archivos para subirlos al servidor. Aunque desde el punto de vista de HTML y del navegador no existe ninguna limitación sobre el número, tipo o tamaño total de los archivos que se pueden adjuntar, todos los servidores añaden restricciones por motivos de seguridad.   



Ejemplo de etiqueta input (type=file)




Fichero adjunto


<input type="file" name="adjunto" />  
      <form action="..." method="post" enctype="multipart/form-data">
  ...

</form>     




#Campos ocultos
Los campos ocultos se emplean para añadir información oculta en el formulario:   

  Ejemplo de etiqueta input (type=hidden)


<input type="hidden" name="url_previa" value="/articulo/primero.html" />

El valor del atributo type para este control de formulario es hidden. Los campos ocultos no se muestran por pantalla, de forma que el usuario desconoce que el formulario los incluye. Normalmente los campos ocultos se utilizan para incluir información que necesita el servidor pero que no es necesario o no es posible que la establezca el usuario. 


#Boton
El aspecto de los botones de formulario se puede personalizar por completo, ya que incluso es posible utilizar una imagen como botón:



 Ejemplo de etiqueta input (type=button)





<input type="button" name="guardar" value="Guardar Cambios" />



El valor del atributo type para este control de formulario es button. Si pruebas a pulsar un botón de este tipo, verás que el navegador no hace nada: no envía los datos al servidor y no borra los datos introducidos. Este tipo de botones sólo son útiles si se utilizan junto con el lenguaje de programación JavaScript. Si la página incluye código JavaScript, los botones de este tipo se pueden programar para que realicen cualquier tarea compleja cuando se pulsa sobre ellos.