Example: Sale Registration Form

A sale registration form for capturing information about a house for sale requires many controls. Placing controls one after the other on the form results in poor form design. Instead, use container controls to design layouts for organizing controls on the form. Layouts improve usability of the form.

To create the form

1. In the Enterprise Console, click the Menu button, and then click Forms. The Forms page appears.

2. Click New, and then click Form. The New Form wizard appears.

3. In the Name box, type Sale Registration, and in the Description box, type House & Sale information.

4. Click Save & Continue. The Sale Registration form is created, and the Form Options wizard appears.

To design the form with layouts

5. Click Design this form.

6. Click Finish. The Forms Designer page appears.

7. Drag Panel Form container from the toolbox to the canvas. The Panel Form appears on the canvas.

8. Point to the Panel Form (P1) container, and then click the Properties button. The Properties dialog box appears.

9. In the Name box, delete the name.

10. Click Apply. The properties are saved and the Properties dialog box is closed.

11. Drag Panel Form container from the toolbox and place it on the Panel Form (P1) container. The Panel Form appears on the canvas.

12. Point to the Panel Form (P2) container, and then click the Properties button. The Properties dialog box appears.

13. In the Name box, delete the name.

14. Click the Appearance tab, and then in the Columns box, type 2. A two-column layout is created.

15. Click Apply. The properties are saved and the Properties dialog box is closed.

16. Drag Image control from the toolbox and place it on the second column of the Panel Form (P2). The Image control appears on the canvas.

17. Point to the Image control, and then click the Properties button. The Properties dialog box appears.

18. In the Image Path box, type the path to the image, and then click Apply. The properties are saved and the Properties dialog box is closed.

19. Drag Panel Form container from the toolbox and place it on the Panel Form (P1) container below the Panel Form (P2) container. The Panel Form appears on the canvas.

20. Point to the Panel Form (P3) container, and then click the Properties button. The Properties dialog box appears.

21. In the Name box, delete the name.

22. Click the Appearance tab, and then in the Columns box, type 2. A two-column layout is created.

23. Click Apply. The properties are saved and the Properties dialog box is closed.

24. Drag Image control from the toolbox and place it on the first column of the Panel Form (P3). The Image control appears on the canvas.

25. Point to the Image control, and then click the Properties button. The Properties dialog box appears.

26. In the Image Path box, type the path to the image, and then click Apply. The properties are saved and the Properties dialog box is closed.

27. Drag Base Form container from the toolbox and place it on the second column of the Panel Form (P3) container. The Base Form container appears on the canvas.

28. In the Name box, type Street Address.

29. Click the Appearance tab, and then in the Label Position list, click Suppress.

30. Click the Validation tab, and then in the Repeating list, click False.

31. Click Apply. The properties are saved and the Properties dialog box is closed.

32. Drag Text control from the toolbox and place it on the Base Form (B1) container. The Text control appears on the canvas.

33. Point to the Text control, and then click the Properties button. The Properties dialog box appears.

34. In the Name box, delete the name.

35. Click Apply. The properties are saved and the Properties dialog box is closed.

36. Drag Text control from the toolbox and place it on the Base Form (B1) container. The Text control appears on the canvas.

37. Point to the Text control, and then click the Properties button. The Properties dialog box appears.

38. In the Name box, delete the name.

39. Click Apply. The properties are saved and the Properties dialog box is closed.

40. Drag Panel Form container from the toolbox and place it on the Base Form (B1) container below the text controls. The Panel Form appears on the canvas.

41. Point to the Panel Form (P4) container, and then click the Properties button. The Properties dialog box appears.

42. In the Name box, delete the name.

43. Click the Appearance tab, and then in the Columns box, type 3. A three-column layout is created.

44. Click Apply. The properties are saved and the Properties dialog box is closed.

45. Drag Text control from the toolbox and place it on the first column of the Panel Form (P4). The Text control appears on the canvas.

46. Point to the Text control, and then click the Properties button. The Properties dialog box appears.

47. In the Name box, type City.

48. Click the Appearance tab, and then in the Label Position list, click Left.

49. Click Apply. The properties are saved and the Properties dialog box is closed.

50. Drag Text control from the toolbox and place it on the second column of the Panel Form (P4). The Text control appears on the canvas.

51. Point to the Text control, and then click the Properties button. The Properties dialog box appears.

52. In the Name box, type State.

53. Click the Appearance tab, and then in the Label Position list, click Left.

54. Click Apply. The properties are saved and the Properties dialog box is closed.

55. Drag Text control from the toolbox and place it on the third column of the Panel Form (P4). The Text control appears on the canvas.

56. Point to the Text control, and then click the Properties button. The Properties dialog box appears.

57. In the Name box, type Zip Code.

58.  Click the Appearance tab, and then in the Label Position list, click Left.

59. Click Apply. The properties are saved and the Properties dialog box is closed.

60. Drag Base Form container from the toolbox and place it on the second column of the Panel Form (P3) container below the Base Form (B1) container. The Base Form container appears on the canvas.

61. In the Name box, type Description.

62. Click the Appearance tab, and then in the Label Position list, click Suppress.

63. Click the Validation tab, and then in the Repeating list, click False.

64. Click Apply. The properties are saved and the Properties dialog box is closed.

65. Drag Panel Form container from the toolbox and place it on the Base Form (B2) container. The Panel Form appears on the canvas.

66. Point to the Panel Form (P5) container, and then click the Properties button. The Properties dialog box appears.

67. In the Name box, delete the name.

68. Click the Appearance tab, and then in the Columns box, type 3. A three-column layout is created.

69. Click Apply. The properties are saved and the Properties dialog box is closed.

70. Drag Text control from the toolbox and place it on the first column of the Panel Form (P5). The Text control appears on the canvas.

71. Point to the Text control, and then click the Properties button. The Properties dialog box appears.

72. In the Name box, type Rooms.

73. Click the Appearance tab, and then in the Label Position list, click Left.

74. Click Apply. The properties are saved and the Properties dialog box is closed.

75. Drag Text control from the toolbox and place it on the second column of the Panel Form (P5). The Text control appears on the canvas.

76. Point to the Text control, and then click the Properties button. The Properties dialog box appears.

77. In the Name box, type Size.

78. Click the Appearance tab, and then in the Label Position list, click Left.

79. Click Apply. The properties are saved and the Properties dialog box is closed.

80. Drag Text control from the toolbox and place it on the third column of the Panel Form (P5). The Text control appears on the canvas.

81. Point to the Text control, and then click the Properties button. The Properties dialog box appears.

82. In the Name box, type Price.

83.  Click the Appearance tab, and then in the Label Position list, click Left.

84. Click Apply. The properties are saved and the Properties dialog box is closed.

85. Drag Text control from the toolbox and place it on the Base Form (B2) below the Panel Form (P5). The Text control appears on the canvas.

86. Point to the Text control, and then click the Properties button. The Properties dialog box appears.

87. Click the Appearance tab, and then in the Display Mode list, click Multi Line.

88. In the Rows box, type 5.

89. Click Apply. The properties are saved and the Properties dialog box is closed.

To preview the form

90. On the action bar, click Preview. The Preview dialog box appears.

91. Check look and feel of the Sale Registration form.

92. Click the Close button. The Preview dialog box is closed.

To publish the form

93. On the action bar, click Publish. The form is published and an information message appears.

94. Click OK. The information message is closed.