El llamado formulario complejo aquí se refiere a un formulario que contiene múltiples tipos de entrada diferentes, como cuadros de lista desplegable, texto de una sola línea, texto de varias líneas, valores numéricos, etc. En situaciones en las que es necesario reemplazar dichos formularios con frecuencia, se requiere un programa de generación dinámica del formulario. Este artículo presenta un sistema de este tipo, que utiliza una base de datos para guardar datos de definición de formularios y utiliza scripts ASP para generar dinámicamente códigos HTML de formularios y scripts para verificar las entradas del formulario.
1. Defina la estructura de la tabla de la base de datos.
A menudo puede ver formularios como "Encuesta semanal" en la Web. Este es un formulario que debe actualizarse con frecuencia. Si existe un programa que genera formularios dinámicamente y sus scripts de validación, la carga de trabajo de realizar estos formularios se puede reducir considerablemente.
En el ejemplo de validación y generación de formularios dinámicos de este artículo, utilizamos una base de datos de Access para almacenar la información de definición del formulario. Al mismo tiempo, para simplificar, los datos ingresados por el usuario en el formulario también se guardan en la misma base de datos. . Definir un formulario requiere dos tablas: la primera tabla (Definiciones) se usa para definir los campos de entrada del formulario y la segunda tabla (Listas) guarda información adicional sobre cada campo de entrada, como los elementos de selección de la lista de selección.
La tabla Definiciones contiene los siguientes campos:
Nombre de campo: el nombre de la variable asignado al campo de entrada del formulario.
Etiqueta: etiqueta de texto, el texto informativo que se muestra delante del campo de entrada
Tipo: un solo carácter, que representa la forma del campo de entrada del formulario y el tipo del valor de entrada, de la siguiente manera:
(t) Cuadro de entrada de texto, es decir, < INPUT TYPE="TEXT" >.
(n) Un cuadro de entrada de texto, pero requiere un valor numérico.
(m) Contenido de nota, utilizado para ingresar comentarios u otras grandes cantidades de texto, es un cuadro de edición de texto de varias líneas.
(b) Requiere la entrada de "sí" o "no". En esta implementación, se utilizará una casilla de verificación para obtener esta entrada, con la etiqueta de texto de la casilla de verificación "Sí". Si el usuario lo selecciona, el valor de retorno está "activado".
(r) Botón de radio.
(l) Cuadro de lista desplegable.
Min: solo válido para valores de entrada numéricos; aquí se proporciona el valor mínimo. En este ejemplo hay un cuadro de entrada numérico "Edad" con su valor mínimo establecido en 1.
Max: el valor de este campo es relativo al formulario del campo de entrada. Para cuadros de entrada numérica, representa el valor máximo permitido. Por ejemplo, el valor máximo de "Edad" es 100. Para cuadros de entrada de texto, Max representa el número máximo de caracteres permitidos. Para cuadros de edición de texto de varias líneas, Max representa el número de líneas de texto en el área visible.
Requerido: indica si se requiere entrada. Si no se ingresa un valor de este tipo, el validador de entrada informará un error. En el formulario, los valores que deben ingresarse están marcados con un asterisco y se le indica al usuario en forma de nota al pie que dichos valores deben ingresarse.
El formulario de ejemplo de este artículo es un cuestionario para programadores de ASP. La definición del formulario en la tabla Definiciones es la siguiente:
Nombre de campo Tipo de etiqueta Mín. Máx. Requerido
Nombre Texto del nombre (t) - 50 No
Edad Número de edad (n) 1 100 No
Sexo. Género único Botón de selección (r) - - Sí
Texto de dirección de correo electrónico (t) - - Sí
Cuadro de lista desplegable del lenguaje de programación de lenguaje (l) - - No
Las listas se utilizan para guardar información adicional definida en el campo de entrada. En este ejemplo, "Sexo se utiliza para los dos valores de entrada" e "Idiomas". La tabla Listas es muy simple y solo contiene los siguientes tres campos:
Nombre de campo: a qué campo de entrada del formulario pertenece el registro actual
Valor: el valor de la selección
Etiqueta: el texto de la selección que ve el usuario
El campo de entrada "Sexo" Sólo se puede ingresar entre dos valores a elegir: “Masculino” o “Femenino”. "Idioma" enumera varios lenguajes de programación que se pueden aplicar al entorno ASP, incluidos: VBScript, JavaScript, C, Perl y "Otros".
La tercera tabla, "Registros", guarda el contenido enviado por el usuario. También contiene tres campos. Cada registro corresponde a un envío del usuario:
Registro: tipo de comentario, entrada del usuario guardada en forma de cadena de consulta.
Creado: la fecha y hora en que el usuario envió el formulario. RemoteIP: la dirección IP del remitente del formulario.
En aplicaciones reales, puede ser necesario recopilar más información sobre los usuarios. Para simplificar, este ejemplo solo registra dos información adicional: hora de envío y dirección IP del usuario.
2. Preparación
Después de completar la definición de la estructura y el formulario de datos anteriores, puede escribir el script. El trabajo del script es generar formularios y procesar formularios enviados por los usuarios.
Ya sea que se esté generando o procesando un formulario, los siguientes tres procesos (tareas) son esenciales: El primero es determinar el tipo de validación. Al generar el formulario, el valor del tipo de validación se obtiene a través de la cadena de consulta y cuando se procesa el formulario. , se obtienen los campos ocultos del formulario Leer. Hay cuatro tipos de métodos de verificación de formularios admitidos por el programa: sin verificación, verificación de JavaScript del lado del cliente, verificación de script ASP del lado del servidor y verificación tanto del lado del cliente como del lado del servidor (los nombres en clave son de 0 a 3 respectivamente). Si no se especifica ningún método de autenticación válido en la cadena de consulta, el cuarto método de autenticación es el predeterminado. Este método de procesamiento de verificación nos permite aplicar de manera flexible este sistema de generación y procesamiento de formularios. Cuando el cliente prohíbe el uso de verificación de JavaScript, el proceso de verificación solo se puede realizar en el lado del servidor. Aquí está el código para determinar el tipo de validación:
Verificar tipo de validación
Aquí está el fragmento de cotización:
iValType = Solicitud.QueryString("val")
Si IsNumeric(iValType) = Falso Entonces iValType = 3
Si iValType > 3 o iValType < 0 entonces iValType =3
La segunda tarea es abrir una conexión de base de datos y crear dos objetos de conjunto de registros: el objeto RS, que es el objeto de conjunto de registros principal en este programa, utilizado para operar la tabla de Definiciones, utilizado principalmente para leer datos de la tabla de Listas. El programa de muestra proporciona dos métodos de conexión de base de datos: usar ODBC DSN o no usar ODBC DSN (al usar DSN, primero debe crear un DSN llamado Dinámico y el código para usar DSN para conectarse a la base de datos ha sido comentado).
La tercera tarea es generar código HTML estático antes (y después) de generar (o procesar) el script del formulario, como <HEAD>< /HEAD>, y liberar RS, RSList y otros objetos ocupados cuando finaliza el recurso del script. .
Además del código que completa las tareas anteriores, hay dos tipos de páginas que pueden generar los scripts ASP restantes en la aplicación de ejemplo: el formulario de preguntas (ver la imagen de arriba) y la página de resultados que aparece después de que se completa el formulario. enviado (este último también es responsable de registrar los resultados enviados por el usuario). La forma más sencilla de determinar qué parte del script ejecutar es verificar si el formulario se ha enviado: si es así, procese el formulario; de lo contrario, genere el formulario;
¿Está generando un formulario o procesando un formulario?
El siguiente es un fragmento de cita:
Si Len (Solicitud.Form) = 0 Entonces
'Generar formulario... ligeramente...
Demás
'Procesa el formulario... ligeramente...
End If
3. Generar dinámicamente el formulario
. Al generar el formulario, el programa define registros de acuerdo con cada campo de entrada en la tabla Definiciones y genera el código HTML y el código JavaScript del formulario correspondiente. Lo primero que se genera en el código HTML es la etiqueta de texto:
Aquí está el fragmento de cita:
sHTML = sHTML y vbTab y "< TR >" y vbCrLf y vbTab y vbTab
sHTML = sHTML & "< TD VALIGN=" & Chr(34) & "ARRIBA" & Chr(34)
sHTML = sHTML y " >" y vbCrLf y vbTab y vbTab y vbTab
sHTML = sHTML & "< B >" & RS.Fields("Etiqueta")
Luego, el programa verifica si el campo de entrada actual requiere entrada. Si es necesario, agregue un asterisco después del texto de la etiqueta (indicando que se debe ingresar el valor), y para el valor que se debe ingresar, se debe generar el código JavaScript correspondiente para verificarlo. Para botones de opción o listas de selección, hay una verificación adicional de que el usuario realmente seleccionó una opción para todos los demás tipos de entrada, simplemente verifique que el valor de entrada no esté vacío.
Después de la etiqueta de texto están los elementos de entrada del formulario, y el código HTML para estos elementos se genera en función de los tipos y atributos especificados en la tabla Definiciones. El siguiente paso es generar código JavaScript que realice tareas de verificación del lado del cliente según los requisitos del valor de entrada. Para este ejemplo, solo los valores numéricos requieren una verificación adicional para garantizar que la entrada del usuario sea realmente un número y que el valor numérico esté entre los valores máximo y mínimo permitidos. Después de generar el código anterior, puede finalizar una fila de la tabla (es decir, un campo de entrada) y continuar procesando el siguiente registro de la tabla Definiciones. Una vez que se hayan procesado todos los registros de la base de datos, el siguiente paso es agregar el código HTML para el botón "Enviar" y el botón "Borrar". Si lo miras desde otro ángulo, la tarea del programa aquí es generar cada campo de entrada en función del registro de la base de datos. Cada campo de entrada ocupa una fila de la tabla, y cada fila de la tabla tiene dos celdas: la primera celda se usa para mostrar. etiquetas de texto y la segunda La unidad muestra el elemento de entrada en sí (consulte dForm.asp para ver el código).
Una vez completado el proceso anterior, el código HTML del formulario y la función JavaScript de validación se guardan en las variables sHTML y sJavaScript respectivamente. Antes de escribir estos contenidos en la página, el programa verifica si el cliente requiere validación de JavaScript. Si dicha validación no es necesaria, la variable sJavaScript se borra:
Si iValType = 0 o iValType = 2 Entonces sJavaScript = ""
Después de generar la etiqueta BODY, el programa genera la siguiente función de JavaScript:
El siguiente es un fragmento de cita:
< IDIOMA DE ESCRITURA="JavaScript" >
< !--
función validar(ElForm){
//Validación del formulario del cliente
< %=sJavaScript% >
devolver verdadero;
}
función CheckRadio(objRadio){
//Si se selecciona un valor en el botón de opción
for(var n = 0; n < objRadio.length; n++){
si(objRadio[n].marcado){
devolver verdadero;
}
}
devolver falso;
}
función Lista de verificación (listaobj) {
//Si se ha seleccionado un valor en la lista de selección
for(var n = 1; n < objList.length; n++){
if(objList.opciones[n].seleccionado){
devolver verdadero;
}
}
devolver falso;
}
//-- >
</ /guión >
Si el cliente no requiere validación de JavaScript, la función de validación queda con una declaración "devuelve verdadero". Las dos últimas funciones estáticas de JavaScript (CheckRadio y CheckList) en el código anterior se utilizan para validar los botones de opción y los cuadros de lista desplegable. La función de validación los llamará cuando sea necesario validar estos dos campos de entrada.
Ahora puede comenzar a escribir el formulario en la página:
< FORM ACTION="./dform.asp" METHOD="POST" NAME="MyForm" onSubmit="return validar(this)" >
Aquí, solo si la función de validación devuelve true Solo entonces realice la operación de envío del formulario. Por lo tanto, cuando la función de verificación de JavaScript del lado del cliente está desactivada, la función de validación devolverá verdadero automáticamente.
Lo siguiente que debemos agregar es un campo oculto llamado val. Como se mencionó anteriormente, este valor indica el modo de validación del formulario.
< INPUT TYPE="HIDDEN" NAME="val" VALUE="< %=iValType% >" >
Cuando el usuario envía el formulario, el script de procesamiento utilizará este valor para determinar si se debe realizar la validación del lado del servidor.
Luego, el resultado es la marca de la tabla y el título de la tabla. El título se guarda en la variable sTitleLabel, cuyo valor se inicializa cuando el script comienza a ejecutarse:
Aquí está el fragmento de cita:
< BORDE DE TABLA="0" >
<TR>
< TD COLSPAN="2" ALIGN="CENTRO" >
< H2 >< %=sTítuloEtiqueta% >< /H2 >
< /TD >
< /TR >
Como medida de mejora, se puede agregar un campo FormID a las tablas Definiciones, Listas y Registros. FormID identifica de forma única un formulario, de modo que el programa puede definir varios formularios al mismo tiempo y guardar los resultados de la respuesta del usuario de varios formularios. En cuanto al sTitleLabel anterior, podemos usar otra tabla (como Formularios) para guardarlo.
Después de la marca y el título de la tabla, el programa genera el formulario HTML y el código para los botones "Enviar" y "Borrar". Después de esto, el programa verifica si la cadena sHTML contiene "*". Si es así, significa que hay contenido que debe ingresarse en el formulario. En este momento, se genera una nota al pie para explicar el significado del asterisco.
Aquí hay una cita:
< %=sHTML% >
<TR>
< TD COLSPAN="2" ALIGN="CENTRO" >
< INPUT TYPE="SUBMIT" VALUE="Enviar formulario" > < INPUT TYPE="reset" VALUE="Borrar" >
< /TD >
<%
'Si hay un campo de formulario que requiere entrada, de ser así, envíe la nota al pie del formulario para explicar el significado de '*'
Si InStr(sHTML,"*") Entonces
%>
< /TR >
< TD COLSPAN="2" ALIGN="CENTRO" >
< FONT SIZE="2" >Nota: Los valores marcados con un asterisco son obligatorios. < /FUENTE>
< /TD >
< /TR >
<%
Terminar si
%>
< /TABLA >
</ /FORMULARIO >
Hasta ahora, se ha completado la tarea de generación del formulario.
4. Procesamiento de los resultados del envío
Las tareas restantes del script ASP son el procesamiento de formularios del lado del servidor, incluida la validación, el almacenamiento de los resultados en la base de datos y la visualización de la página "Envío exitoso/fallido". En esta parte del código de validación del formulario se utiliza una variable de cadena sBadForm y el programa la utiliza para guardar información de error. Si sBadForm está vacío al final del proceso de verificación, significa que el formulario enviado por el usuario es legal; de lo contrario, el envío del formulario se rechaza y sBadForm se devuelve al navegador;
Independientemente del modo de validación que utilice su formulario, es una buena práctica verificar HTTP_REFERER. Esta verificación evita el robo de guiones. Para comprobar si un determinado POST proviene de una página o script de este sitio web, simplemente compare dos variables del servidor:
Aquí está el fragmento de cita:
Si InStr(Request.ServerVariables("HTTP_REFERER"), _
Request.ServerVariables("HTTP_HOST")) = 0 Entonces
sBadForm = "<LI>El formulario se envió desde una ubicación incorrecta." & vbCrlf
Terminar si
Si el campo oculto del formulario indica que se debe realizar la verificación del lado del servidor, el programa atraviesa los registros de la base de datos de definición del formulario y realiza las verificaciones correspondientes. El proceso es muy similar a la generación del formulario, excepto que esta vez el programa verifica el. formulario y agrega información de valor de entrada ilegal a Simplemente vaya a sBadForm. Consulte dForm.asp para obtener código específico.
El programa finalmente comprueba si sBadForm está vacío. Si no está vacío, se rechaza el envío del formulario y se escribe sBadForm en el navegador. Si sBadForm está vacío, agregue un registro a la tabla Registros para guardar los datos del formulario. El campo oculto val debe eliminarse antes de guardar el contenido del formulario. Este campo oculto es siempre el primer campo de entrada del formulario:
lo siguiente es un fragmento de cita:
Si Len(sBadForm) = 0 Entonces
RS.Abrir "Registros", DB, 3, 2, &H0002
RS.AñadirNuevo
RS.Fields("Registro") = Mid(Solicitud.Form, InStr(Solicitud.Form, "&") + 1)
RS.Fields("Creado") = Ahora()
RS.Fields("RemoteIP") = Solicitud.ServerVariables("REMOTE_ADDR")
RS.Actualización
Response.Write("< H1 >Gracias.< /H1 >")
RS.Cerrar
Demás
Response.Write("< H1 >Error en el envío del formulario. < /H1 >")
Respuesta.Escribir (vbCrLf y sBadForm)
Terminar si
Terminar si
Eso es todo para el procesamiento de formularios del lado del servidor. Dependiendo de si hay un formulario enviado, podemos encapsular el código de generación del formulario anterior y el código de procesamiento del formulario aquí con una declaración If, de modo que las dos partes del script compartan algún código común, como el encabezado del documento HTML, la creación de objetos de base de datos y la liberación de recursos.
En general, dForm.asp sólo tiene las funciones básicas necesarias para la generación y verificación de formularios dinámicos e ignora el manejo de muchos problemas detallados. Por ejemplo, el problema de múltiples formularios mencionado anteriormente: agregar una tabla para administrar múltiples formularios permite que el script tenga la capacidad de administrar, generar y procesar formularios específicos. Otra carencia evidente es la capacidad de agregar, eliminar y actualizar datos definidos en el formulario, así como el acceso a los datos de resultados enviados por el usuario. Dicha funcionalidad podría implementarse en un programa independiente y, en la mayoría de los casos, podría convertirse en un programa independiente. Aplicación tradicional (Aplicaciones sin estructura B/S). Finalmente, los tipos de campos de entrada admitidos por dForm.asp también son limitados. En la práctica, puede haber otros requisitos de entrada del formulario, como un cuadro de entrada de dirección de correo electrónico dedicado. Sin embargo, para los sitios web que actualizan formularios con frecuencia, las funciones de generación dinámica de formularios y validación dinámica analizadas en este artículo son realmente muy útiles.