jueves, 1 de diciembre de 2011

14.- Arquitectura de formularios y su adaptación dinámica

Los formularios constituyen un elemento esencial en todo el aparato de comunicaciones y edición del sitio web. Es por ello que requieren un tratamiento especial y una revisión en su modo de construcción. Los formularios son empleados como recipiente de recogida de datos. Su modo empleo más común es el envío de mensajes y correos como método de contacto. Pero también son utilizados para otros cometidos, por ejemplo, como sistema de selección y filtrado de opciones en un buscador, como campos de edición para un registro, para representar datos de una edición, para enviar valores y contenidos entre distintas páginas web y finalmente el uso dinámico de la información que el usuario introduce en el sitio web. Dicho de otra forma, supone uno de los nexos que conectan el sistema de información al usuario.

Formularios estáticos
Se considera formulario estático aquel que no emplea funciones de PHP para la recogida de información enviada por si mismo o a otra página o programa de PHP (Léase cualquier programa elaborado con un lenguaje de programación dinámico orientado a objetos). Ello significa que un formulario estático es únicamente una estructura de etiquetas HTML con una disposición básica en cuanto a su modo de funcionamiento (es decir, un modo de funcionamiento sencillo, unidireccional a un determinado destino que se identifica claramente con un correo electrónico), por ejemplo véase tabla1.

<form name='contactar' id='contactar' action='mailto:mblazquez.ccdoc@gmail.com' method='post'>

<input type='hidden' name='id' value=''/> identificador
<input type='text' size='40' name='titulo' value=''/> título
<input type='password' size='40' name='pass' value=''/> contraseña

<input type='radio' name='centro' value='archivo'/> Archivo
<input type='radio' name='centro' value='biblioteca'/> Biblioteca
<input type='radio' name='centro' value='museo'/> Museo

<input type='checkbox' name='user' value='investigador'/> Investigador
<input type='checkbox' name='user' value='profesor'/> Profesor

<textarea cols='60' rows='4' name='comentarios'></textarea>

<select name='tipologia'>
  <option value='monografia'>Monografía</option>
  <option value='diccionario'>Diccionario</option>
  <option value='articulo'>Artículo</option>
</select>


<select name='tematica'>
  <optgroup label='Ciencias y técnicas auxiliares'>
    <option value='
bibliofilia'>Bibliofilia</option>
    <option value='bibliografia'>Bibliografía</option>

    <option value='encuadernacion'>Encuadernación</option>
  </optgroup>
  <optgroup label='Museología'>
    <option value='museografía'>Museografía</option>
    <option value='patrimonio'>Patrimonio</option>
  </optgroup>
</select>


<input type='button' onClick="history.go(-1)" value='atrás'/>
<
input type='button' onClick="history.go(1)" value='adelante'/>
<
input type='button' onClick="window.location='http://'" value='cargar página'/>
<
input type='button' onClick="window.location.reload()" value='recargar página actual'/>

<input type='submit' name='go' value='Enviar datos'/>


</form>
 Tabla1. Principales componentes del formulario

Elemento Descripción
<input type='text'.../> Elemento principal de un formulario. La caja de texto es empleada para almacenar 1 línea de texto o cadena de caracteres.
<input type='hidden'.../> Caja de texto oculta en el formulario, no visible para el usuario. Ampliamente utilizada para almacenar valores especiales, identificadores de registros, o cualquier información necesaria para la ejecución de una rutina en PHP. Es muy frecuente utilizar un campo oculto para alojar el valor del identificar de un registro de un documento, o un código alfanumérico que debe ser utilizado posteriormente para efectuar una consulta o un valor que debe ser almacenado con fines estadísticos, de contabilización, por ejemplo.
<input type='password'.../> Campo de texto confidencial destinado a la introducción de contraseñas, evita que se visualicen en pantalla y bloquea la copia del valor de la contraseña que se escribe. Utilizado frecuentemente en el desarrollo de aplicaciones de acceso a páginas web.
<input type='radio'.../> Campo de selección por círculo, permite establecer distintas opciones entre las que se debe seleccionar una de ellas. 
<input type='checkbox'.../> Selección de una o varias opciones mediante cajas de verificación con ticks.
<textarea...></textarea> Campo para el área de texto. Cuando se necesita reseñar textos más largos de una línea, se utiliza este elemento.
<select...>
<option...></option>
</select>
Campo selector que permite escoger una opción entre las presentadas en la lista.
<select...>
<optgroup...>
<option...></option>
<optgroup>
</select>
Campo selector, con opciones agrupadas.
<input type='button'.../> Campo de botón, utilizado para añadir eventos javascript, funcionando como método desencadenante de acciones. Por ejemplo, cargar una página web al hacer click, actualizar la página actual al hacer click, etc.
<input type='submit'.../> Botón de envío de formularios.



 Tabla2. Descripción de componentes del formulario

El método de envío de datos
La forma o protocolo con el que se envía la información es fundamental dependiendo del uso que se hace de la información contenida en los mensajes. Recuérdese que muchos formularios, actúan como interfaz entre el usuario y el sistema, para que éste actúe de una determinada forma ó simplemente para que publique una información ó sea enviado a un determinado destino. Para ello los mensajes escritos desde formularios pueden ser enviados mediante método GET, reconocible e identificable mediante una cabecera pública ó bien por el método POST, cuya información queda asegurada hasta su recepción en el servidor de destino.
[ Método GET ]
Permite efectuar una solicitud al servidor de tal forma que ésta pueda ser identificada mediante URI. Los valores y datos del mensaje se envían desde la cabecera y no dentro del cuerpo del mismo, por ello quedan expuestos y se considera un método de comunicación menos seguro.

[ Método POST ]
Permite efectuar una solicitud al servidor de forma segura sin posibilidad de identificar el recurso enviado por URI. Esto se debe a que los datos y variables de la petición se encuentran en el cuerpo del mensaje y no en la cabecera.  Por ejemplo, esto significa que los datos enviados en un proceso de comunicación como en un grupo de noticias, una lista de correos, un comentario, un correo electrónico o la petición de publicación de información no pueden ser identificados a excepción de la página del servidor al que se destine la solicitud.

El formulario dinámico
La información enviada a través de formularios ya fuere por método POST o GET, puede ser recuperada y gestionada mediante variables globales propias de los lenguajes de programación dinámicos, por ejemplo PHP. De tal forma que si se dispone de un formulario como el presentado en la tabla1 y un archivo de recepción de los datos del formulario, como el dispuesto en la tabla2, sería posible enviar mensajes e imprimirlos en pantalla.

<!-- archivo: enviar.html -->
<!-- ==================== -->

<form
action='recibir.php' method='post'>
  <input type='text' name='title'/>
  <textarea cols='60' rows='3' name='description'></textarea>
  
  <input type='submit' name='send' value='Publicar'/>

</form>
 Tabla1. Formulario para el envío de datos con método POST

<?php
// archivo: recibir.php

// ====================
echo "<div>";
echo "<div>$_POST[title]</div>";

echo "
<div>$_POST[description]</div>";

echo "</div>";

?>

 Tabla2. Archivo de recepción que presenta en pantalla la información del mensaje

De esta forma es posible utilizar la información enviada para que sea almacenada, mostrada en pantalla, enviar parámetros de ejecución para un programa o símplemente para enviar un correo electrónico. En PHP se utilizan las variables globales $_GET[nombre] y $_POST[nombre] en alusión al método por el que fue enviada la información del formulario y el nombre del parámetro que fue enviado desde una caja de texto, área de texto, selector o cualquier otro elemento del formulario. En PHP una variable es un recipiente utilizado para almacenar información, datos, textos o valores de tipo numérico, textual o alfanumérico. De esta forma con independencia del tipo de formulario empleado la información enviada es empaquetada y guardada en estas variables de tal forma que puedan ser recuperadas y posteriormente utilizadas. Se denominan variables globales, porque pueden ser utilizadas en cualquier punto del programa PHP que se edite para recibir la información del formulario. No obstante también tienen caducidad si no son recibidas por el destinatario, perdiéndose la información. Por otra parte, también es práctica común utilizar una sóla página para el envío, recepción y proceso de la información, véase tabla3.

<?php
// archivo: enviar-recibir.php

// ===========================
echo "<form action='enviar-recibir.php' method='get'>
  <input type='text' name='title'/>
  <textarea cols='60' rows='3' name='description'></textarea>
  
  <input type='submit' name='send' value='Publicar'/>

</form>
";

if($_GET[send]){
   echo "<div>";
   echo "<div>$_GET[title]</div>";

   echo "
<div>$_GET[description]</div>";

   echo "</div>";

}

?>

 Tabla3. Archivo de envío y recepción de datos

Obsérvese que en la tabla3, a diferencia de los casos anteriores, se añade una estructura de control condicional para desencadenar la impresión en pantalla del mensaje sólamente si este fue enviado. En este código la condición if(condición){instrucción} establece entre paréntesis que la variable send debió de ser enviada, es decir, el usuario debió de hacer click en el botón publicar. Si esa condición se cumple, se ejecuta todo el proceso que ha sido alojado entre la apertura y cierre de llaves. En este caso es la impresión del campo título y campo descripción del formulario.

A pesar de lo expuesto, existen otras formas de enviar información, no únicamente mediante formularios. Se trata del caso del método GET por medio de URL. Tal como se explicaba anteriormente, el protocolo GET implica una identificación mediante URI (Universal Resource Identifier) es decir, que la información es enviada a través de una URL y es visible por aparecer en la cabecera de las peticiones que se envían mediante HTTP. De hecho cuando se aprecian direcciones como las de la tabla4, se aludirá al método GET, por medio de URL.

http://www.dominio.org/publicaciones.php?id=10&url=biblioteca&title=fuentes-bibliotecarias&text=Esto%20es%20una%20prueba
<?php
   echo "$_GET[id]";
   echo "$_GET[url]";
   echo "$_GET[title]";
   echo "$_GET[text]";
?>
 Tabla4. Archivo de envío y recepción de datos

La información puede ser recuperada igualmente, con la salvedad de que ésta debe ser emplazada con una sintaxis determinada. Como se puede observar la URL separa el nombre y extensión del archivo de los valores o datos que serán transmitidos por medio de un signo de interrogación ( ? ). Seguidamente se reseñan en color azul el nombre de la variable que contendrá un determinado dato, separado por el signo igual ( variable=dato ). Cuando existen más de una variable a transmitir, se emplea el signo ampersand ( & ) para distinguir la primera variable de las subsiguientes ( variable1=dato1&variable2=dato2 ).

No hay comentarios:

Publicar un comentario