Tutorial: Campos con etiqueta debajo

En este tutorial, se creará un formulario con etiquetas debajo de los campos utilizando la tabla de ejemplo “empleados” y los siguientes recursos adicionales:

  • Bloques
  • Páginas

Crear un formulario con etiquetas debajo de los campos

Nota:

Si tiene alguna pregunta sobre cómo crear un formulario, vaya a: Creación de un formulario nuevo

1. Cree una nueva aplicación de tipo Formulario del tipo Registro Único, luego seleccione la tabla “employees“.

2. Hecho esto, si desea una mejor visualización del formulario, haga clic en la pestaña “Editar los campos” y cambie el nombre de los campos resaltados, como se muestra en las imágenes a continuación.

Editar campos de formulario con etiquetas debajo de los campos

1. Vaya a la opción “Layout – Bloques” en el menú de la aplicación.

2. Una vez hecho esto, cambie el nombre de la página existente a “Información personal“, cree una nueva página, llamada “Anotaciones“, y luego haga clic en el botón “Incluir” como se muestra en la imagen a continuación.

3. Aún en la pestaña “Layout“, seleccione la opción “Bloques“.

3. Una vez hecho esto, cambie el nombre del bloque existente a “Información personal” y configúrelo de acuerdo con la imagen a continuación.

5. Aún en la configuración del bloque, haga clic en el botón “Crear nuevo bloque” y cree un nuevo bloque titulado “Dirección“.

6.Después de crear el bloque “Dirección”, cree otro bloque titulado “Anotaciones“.


7.Ahora, coloque el bloque “Información Personal” en “Información Personal” y configúrelo de acuerdo con la imagen de abajo.

8. Una vez hecho esto, en el menú de la aplicación, acceda a la pestaña “Posicionamiento de los campos“.

9.Ahora, mueva los campos: “employeeid“, “titleofcourtesy“, “homephone“, “photo“, “reportsto“, “photopath” y “extension” al cuadro de la izquierda, como se muestra a continuación.

10. Luego, organice los campos en sus respectivos bloques y páginas, como se muestra en la imagen a continuación.

11. Finalmente, haga clic en el botón “Ejecutar aplicación

Hecho esto, después de seguir los pasos anteriores, el formulario se verá así:

Para ver más ejemplos creados con Scriptcase, vaya a: Ejemplos: Sistemas completos y aplicaciones con Scriptcase.

Tutorials in the same category

Tutorial: Formulário Multi-Etapas

En este tutorial veremos cómo crear un formulario de varios pasos, haciendo que el formulario sea m...

Form login responsivo 3

En este ejemplo, veremos cómo utilizar las Plantillas HTML disponibles para crear aplicaciones de ...

Tutorial: Form login responsivo 2

En este ejemplo, veremos cómo utilizar las Plantillas HTML disponibles para crear aplicaciones de...

Form login responsivo

En este ejemplo, veremos cómo utilizar las Plantillas HTML disponibles para crear aplicaciones de ...

Comment this post