Formularios › El Diseñador de formularios › Funciones del elemento de formulario › Creación de un formulario simple con funciones básicas

Creación de un formulario simple con funciones básicas

En este ejemplo, se está desarrollando un formulario para una compañía que trabaja en tres regiones principales (California, Pensilvania y Carolina del Norte). En cada estado, la compañía tiene una ubicación de oficina primaria y secundaria identificada mediante el nombre de la ciudad. Los interesados responsables de implementar la política de la compañía desean que el formulario cumpla los requisitos de negocio siguientes:

• Todo el negocio que se origine en California se debe dirigir de forma predeterminada a la oficina de Anaheim.
• Todo el negocio que se origine en Pensilvania se debe dirigir de forma predeterminada a la oficina de Filadelfia.
• Todo el negocio que se origine en Carolina del Norte se debe dirigir de forma predeterminada a la oficina de Raleigh.
• Todo el negocio que se origine en cualquier otro estado se debe dirigir de forma predeterminada a la oficina de Pittsburgh.
• El usuario tiene la opción de especificar otro estado u otra ciudad.

Ejemplo: un formulario básico

Lleve a cabo los pasos siguientes:

1. Haga clic en la ficha Biblioteca.
2. Cree un objeto de formulario de solicitud de interacción o busque uno existente para utilizar con este procedimiento de muestra.
3. Haga doble clic en el objeto de formulario.

   Aparecerá el cuadro de diálogo Formulario de solicitud de interacción, o Diseñador de Formularios.

4. Si el objeto de formulario todavía no se ha extraído, haga clic en Extraer.
5. En el panel Elementos de formulario, expanda las entradas siguientes:
   1. Elementos de formulario
   2. Su formulario (por ejemplo, Interaction_Request_Form_4)
   3. Vista de página
   4. Página
6. Haga clic en Página.
7. Haga clic en Renombrar en la barra de herramientas.
8. Introduzca la ubicación del nombre y haga clic en Aceptar.
9. Arrastre un campo de selección desde el panel Formulario hasta la página de ubicación.
10. Repita el paso 9.

    Aparecerán dos campos de selección bajo el diseño de la página de ubicación.

11. Lleve a cabo las acciones siguientes en el panel Formulario:
    1. Arrastre tres opciones de selección hasta el primer campo de selección.
    2. Arrastre seis opciones de selección hasta el segundo campo de selección.
12. Haga clic en cada uno de los siguientes elementos de formulario y, a continuación, haga clic en Renombrar para cambiar el nombre de cada objeto, tal y como se indica:
    1. Renombre el primer campo de selección como State (Estado).
       • Renombre la primera opción como CA.
       • Renombre la segunda opción como PA.
       • Renombre la tercera opción como NC.
    2. Renombre el segundo campo de selección como City (Ciudad).
       • Renombre la primera opción como Anaheim.
       • Renombre la segunda opción como Los Angeles.
       • Renombre la tercera opción como Pittsburgh.
       • Renombre la cuarta opción como Philadelphia.
       • Renombre la quinta opción como Charlotte.
       • Renombre la sexta opción como Raleigh.
13. Haga clic en cada uno de los elementos de formulario siguientes y realice las siguientes configuraciones de propiedad en el panel Propiedades (Nombre y Valor).
    1. Para State (Estado):
       • Configure el nombre como State (Estado).
       • Establezca el valor del evento onChange como ca_fd.js.selectRegion().
       • Establezca el valor de la opción CA como California.
       • Establezca el valor de la opción PA como Pennsylvania.
       • Establezca el valor de la opción NC como North Carolina (Carolina del Norte).
    2. Para City (Ciudad):
       • Configure el nombre como City (Ciudad).
       • Establezca la propiedad de valor de cada opción de ciudad como el nombre de la ciudad. Por ejemplo, establezca Anaheim como Anaheim, Los Angeles a Los Angeles, etc.
14. En el panel Elementos de formulario, haga clic en el nombre de su formulario y, a continuación, haga clic en Script en la barra de herramientas.

    Se abre el cuadro de diálogo Script.

15. Copie y pegue el código siguiente en el editor de script:

    {
     selectRegion: function() 
      {
    	var selectedState = ca_pam_getSelectedOptionValues('Form.State')[0];
     
    	if(selectedState == 'North Carolina') 
    	 {
    	  ca_pam_selectOption('Form.City', 'Raleigh', 'Raleigh', true);
    	 }
    	else if(selectedState == 'California')
    	 {
    	  ca_pam_selectOption('Form.City', 'Anaheim', 'Anaheim', true);
    	 }
    	else if(selectedState == 'Pennsylvania')
    	 {
    	  ca_pam_selectOption('Form.City', 'Philadelphia', 'Philadelphia', true);
    	 }
    	else
    	 {
    	  ca_pam_selectOption('Form.City', 'Pittsburgh', 'Pittsburgh', true);
    	 }
      }
    }
    

16. Haga clic en Guardar. Se cerrará el cuadro de diálogo Script.
17. Haga clic en Guardar en el diseñador de formularios.
18. Haga clic en la ficha Vista previa.
19. Compruebe que sus resultados sean similares a los valores y resultados de muestra de la ilustración y la tabla que aparecen a continuación: