PDF de programación - Uso de formularios HTML para enviar y recopilar datos

Imágen de pdf Uso de formularios HTML para enviar y recopilar datos

Uso de formularios HTML para enviar y recopilar datosgráfica de visualizaciones

Publicado el 8 de Junio del 2018
1.150 visualizaciones desde el 8 de Junio del 2018
1,9 MB
20 paginas
Creado hace 14a (12/02/2010)
Uso de formularios
en HTML para enviar
y recopilar datos


Piero Berni Millet

PID_00155708

CC-BY • PID_00155708

Uso de formularios en HTML para enviar y recopilar datos

Los textos e imágenes publicados en esta obra están sujetos –excepto que se indique lo contrario– a una licencia de Reconocimiento
(BY) v.3.0 España de Creative Commons. Podéis copiarlos, distribuirlos y transmitirlos públicamente siempre que citéis el
autor y la fuente (FUOC. Fundación para la Universitat Oberta de Catalunya). La licencia completa se puede consultar en
http://creativecommons.org/licenses/by/3.0/es/legalcode.es

CC-BY • PID_00155708

Índice

Uso de formularios en HTML para enviar y recopilar datos

Introducción a CGI y su entorno..................................................

1.

2. Uso de formularios HTML/XHTML...............................................
Tipos de entradas de formularios ...............................................
La etiqueta <input> .....................................................................
La etiqueta <select>...</select> ....................................................
La etiqueta <textarea>...</textarea> ............................................

2.1.
2.2.
2.3.
2.4.
2.5. Distintas maneras de enviar los datos de un formulario

(atributo method) .........................................................................
2.6. Codificación estándar application/x-www-form-unlencoded...........


3. Leer datos de un formulario con PHP.........................................

3.1. Variables predefinidas de PHP y su relación con los

formularios ..................................................................................

5

8
8
8
11
12

12
13

16

18

CC-BY • PID_00155708

5

Uso de formularios en HTML para enviar y recopilar datos

1. Introducción a CGI y su entorno

La interfaz de pasarela común (CGI1) es la puerta de acceso que hay
entre una página web y el servidor de Internet donde reside la página.

Si habéis utilizado un navegador web, os habréis encontrado con páginas web
que permiten interrogar bases de datos para obtener información. ¿Qué está
sucediendo detrás de la página? En resumen, el navegador envía solicitudes al
servidor y el servidor envía respuestas al navegador. Este intercambio es una
cuestión sencilla cuando la solicitud es mostrar otra página web. Pero cuando
el navegador desea algo más complejo, como el último parte meteorológico
en España, hay grandes posibilidades de que el gestor de la información detrás
de la página web sea un programa escrito con un script CGI.

(1)CGI es la sigla inglesa de com-
mon gateway interface.

Lenguaje de un script CGI

Un script CGI puede ser escri-
to en cualquier lenguaje que
pueda leer de STDIN (entrada
estándar), escribir en STDOUT
(la salida estándar) y leer varia-
bles de entorno como virtual-
mente cualquier lenguaje de
programación, incluyendo C,
Perl, PHP, o incluso scripts de
Shell de UNIX y LINUX.

Solicitud http sencilla para mostrar otra página web

CC-BY • PID_00155708

6

Uso de formularios en HTML para enviar y recopilar datos

Solicitud http combinada con CGI

La programación CGI consiste en el diseño y la escritura de programas que
reciben sus órdenes iniciales desde una página web. Los formularios HTML se
han convertido en el método preferido para enviar datos a través de Internet
debido a su facilidad de uso y de configuración.

La idea básica detrás de un formulario es sencilla, tal y como se ilustra en
la siguiente figura. El visitante abre un formulario y lo rellena; el navegador
envía los datos al servidor; el programa CGI captura la corriente de datos del
formulario y la procesa; el programa CGI devuelve algún tipo de respuesta al
visitante a través del servidor.

CC-BY • PID_00155708

7

Uso de formularios en HTML para enviar y recopilar datos

La idea básica detrás de un formulario

CC-BY • PID_00155708

8

Uso de formularios en HTML para enviar y recopilar datos

2. Uso de formularios HTML/XHTML

Las etiquetas <form> son la base para el traspaso de datos a los programas CGI
en el servidor.

Un formulario de una página web es una colección de campos de en-
trada que comunican su contenido al servidor.

En el mundo de Internet y de las páginas web se suelen utilizar para múltiples
propósitos: formularios de pedidos de una tienda electrónica, cuestionarios,
encuestas, libros de invitados, consultas a bases de datos, etc. Todos ellos de-
vuelven datos al propietario de la página web para que sean procesados pos-
teriormente.

En este apartado vamos a ver sólo el modo de situar un formulario en una
página web. Más adelante aprenderemos a procesar los datos que se reciban
desde un formulario.

2.1. Tipos de entradas de formularios

Los elementos de los formularios HTML/XHTML ofrecen una variedad de for-
mas de aceptar las entradas de los datos de los visitantes: entradas de líneas de
texto, campos de texto formados por múltiples líneas, casillas de verificación,
botones de opción, listas de opciones de varios tipos, campos ocultos para ad-
ministrar la información, etc.

Podéis colocar cualquiera de estos elementos en el cuerpo de un documento
HTML/XHTML si se delimitan con la etiqueta <form> y su respectiva etiqueta
de fin, </form>. Todos los elementos dentro de estas dos etiquetas componen
un único formulario. Los elementos de entrada de datos más comunes son:
<input>, <select>, y <textarea>.

2.2. La etiqueta <input>

Los elementos de entrada de un formulario se crean principalmente con la
etiqueta <input>. Ésta define el comportamiento y la posición del campo para
que acepte datos del visitante en un formulario. Esta etiqueta acepta una serie
de atributos como type, name, value, size, maxlength, etc.

En el siguiente ejemplo se muestra un formulario con tres elementos para in-
troducir texto, “nombre”, “apellidos” y “direccion”:

CC-BY • PID_00155708

9

Uso de formularios en HTML para enviar y recopilar datos





Los dos primeros elementos <input> son cuadros de texto de una única
línea (type=”text”) de 30 y 50 caracteres de ancho (size); permite al usuario
teclear sólo 30 y 50 caracteres (maxlength), respectivamente; el contenido
del campo se muestra, por defecto, en blanco al no existir el atributo value.

El tercer campo es otro cuadro de texto con un tamaño de visualización
de 75 caracteres y con capacidad máxima para 100 caracteres; establece
un valor inicial (value=” Calle “) como encabezamiento del resto de la
información que va a rellenar el usuario.

El nombre de la variable que identifica cada campo se indica en el atributo
name. Este nombre es imprescindible para que el servidor pueda procesar el
formulario.

El atributo type indica el tipo de control que se incluye en el formulario y que
puede tener los siguientes valores:

“text | password | checkbox | radio | submit | reset | file

| hidden | image | button”

A continuación presentamos el significado de los controles en función de su
tipo:

1)￿type=”password”. Oculta la entrada del usuario reemplazándola por aste-
riscos en la pantalla, por lo que es ideal para escribir contraseñas y otros datos
privados. El navegador los transmite sin encriptar cuando se envían al servidor.

Contraseña <br/>

CC-BY • PID_00155708

10

Uso de formularios en HTML para enviar y recopilar datos

<input type=”password” name=”contrasena” value=”” />

2)￿type=”checkbox”. Las casillas de verificación son controles de formulario
que permiten al usuario seleccionar y deseleccionar opciones individualmen-
te. Si se quiere mostrar un checkbox seleccionado por defecto, se utiliza el
atributo checked. Las casillas de verificación no seleccionadas no aparecen en
los datos enviados.

3)￿type=”radio”. Botones radiales. Los controles de tipo radiobutton son si-
milares a los controles de tipo checkbox, pero presentan una diferencia muy
importante: son mutuamente excluyentes. Son adecuados para aceptar un va-
lor individual de un conjunto de alternativas. Todos los botones radiales de
un mismo grupo reciben el mismo nombre. Solamente el botón radial selec-
cionado del grupo aparece en los datos enviados. Uno de ellos puede estar se-
leccionado desde el inicio si se le incluye el atributo checked.

Tipo de inscripción <br/>

<input type=”radio” name=”inscripcion” value=”completa”

checked=”checked” /> Cuota completa: 180 €

<input type=”radio” name=”inscripcion” value=”general” />

Cuota general: 80 €

<input type=”radio” name=”inscripcion” value=”estudiante” />

Cuota estudiante: 50 €

4)￿type=”hidden”. Los campos ocultos se emplean para añadir información
oculta en el formulario, por lo que no aparece en la pantalla de la página web,
de modo que el usuario desconoce que el formulario los incluye. Se utiliza para
comunicar información sobre el estado de la interacción entre el cliente y el
servidor, que necesita el servidor pero que no es necesario o no es posible que
la establezca el usuario; por ejemplo, un identificador de transacción.

5)￿type=”submit”. Botón de envío de formulario. La mayoría de los formula-
rios disponen de un botón para enviar al servidor los datos introducidos por
el usuario. El valor del atributo value es el texto que muestra el botón. Si no
se establece el atributo value, el navegador muestra el texto predefinido En-
viar consulta. Pero si se proporciona un atributo name, podremos incluir los
atributos name y value entre los datos enviados. Esta opción es útil cuando se
coloca en el formulario más de un botón de envío, ya que brinda un modo de
identificar en qué botón del formulario se ejecutó la acción.

CC-BY • PID_00155708

11

Uso de formularios en HTML para enviar y recopilar datos

<input type=”submit” name=”buscar” value=”Buscar” />

6)￿type=”reset”. Botón de reseteo o restauración del formulario. Se trata de un
botón especial que borra todos los datos introducidos por el usuario y devuelve
el formulario a su estado original.

<input type=”reset” name=”limpiar” value=”Borrar da
  • Links de descarga
http://lwp-l.com/pdf11714

Comentarios de: Uso de formularios HTML para enviar y recopilar datos (0)


No hay comentarios
 

Comentar...

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios...
CerrarCerrar
CerrarCerrar
Cerrar

Tienes que ser un usuario registrado para poder insertar imágenes, archivos y/o videos.

Puedes registrarte o validarte desde aquí.

Codigo
Negrita
Subrayado
Tachado
Cursiva
Insertar enlace
Imagen externa
Emoticon
Tabular
Centrar
Titulo
Linea
Disminuir
Aumentar
Vista preliminar
sonreir
dientes
lengua
guiño
enfadado
confundido
llorar
avergonzado
sorprendido
triste
sol
estrella
jarra
camara
taza de cafe
email
beso
bombilla
amor
mal
bien
Es necesario revisar y aceptar las políticas de privacidad