• No results found

Part B: Create the sections for selecting hardware and software items

In document Build Your First Application Pega (Page 91-101)

Globex's requirements for the work item include having selection lists for the user to select the hardware and soft-ware items for the new hire. The following steps describe how to create section rules that provide the user interface controls for these lists at runtime.

As you perform these steps, a warning message might display stating "The Property Panel is Dirty. Do you want to save the changes?". If that message appears, click OK . It indicates that a Cell Properties panel has unsaved changes.

1. In Step 6.A, you expanded the User Interface category under theGLBX-FW-OnboardingFW-Workclass in the Application Explorer. Right-click onSectionand selectNewfrom the context menu.

2. In the New Instance of a Rule dialog, enterSelectHardwarefor thePurposefield. Confirm theApplies To, RuleSet, andVersionfields are set toGLBX-FW-OnboardingFW-Work,OnboardingFW, and01-01-01, and theTemplatefield is blank. Click Create.

3. Switch to wireframe mode by clicking .

4. Add a Repeat Grid under the default layout by adding a layout as you did in Step 6.A, and in the Set Layout Type window, select theRepeatingradio button and selectGridin the drop-down menu. Then delete the default layout (Smart Layout (Double) -1).

5. Open the properties panel for the Repeat Grid by selecting the Repeat Grid and clicking the magnifying glass ( ) .

6. In the Repeat Grid properties panel, make sure theSourceis set toProperty. In theList/Groupfield, use

the SmartPrompt to selectHardwareItems. Set theEdit ModetoRead/Write.

7. Complete headings for the first two columns of the repeat grid. Select the top cell of the first column. The prop-erties panel refreshes to reflect the currently selected cell's data. TypeHardwarein theValuefield. Select the top cell of the second column. TypePricein theValuefield.

8. Add a DynamicSelect control to the cell below the Hardware heading by clicking the down arrow at the right end of the Advanced control group, selecting the DynamicSelect choice, and dragging it into the cell.

9. Click next to the cell with the DynamicSelect to open its properties panel. In thePropertyfield, use the SmartPrompt to display the list of choices. Double-clickMoreto see the full list of available properties. Scroll down until you locate the.pyLabelproperty, and double-click it to specify it for thePropertyfield.

10. Use the following steps to specify the method for the system to use at runtime to get the contents of the DynamicSelect list. In this tutorial, an activity is used to get the hardware items to populate this

DynamicSelect. The activity was provided in the zip file you imported into the system before beginning the tutorial.

a. Click the magnifying glass ( ) beside the Control field to display the parameters form for the Dynam-icSelect control.

b. Specify the following parameters:

Parameter Setting

Method for Generating Dynamic Select Select theActivityradio button.

Activity Information:

Applies To Use the SmartPrompt to select

GLBX-Data-Hardware.

Activity Name After selecting the class for the

Applies Tofield, use the Smart-Prompt to selectgetHardware.

Class of Returned Results Use the SmartPrompt to select GLBX-Data-Hardware.

c. Do not change any other fields in the window, and click OK to save your choices and close the param-eters window.

11. Use the following steps to specify the runtime (client-side) event that will trigger the change in the displayed values. Here, we want the price displayed in the Price column to refresh whenever the selected item in the Hardware column changes. The event typically used to do this for selection lists is the "On Change" event.

a. In the Cell Properties panel, in theBehaviorfield, click the magnifying glass ( ) to open the Client Event Editor. In theEventfield, selectOn Change, and set theActionfield toRefresh this

Section.

b. Do not change any of the other fields and click Save to save your choices and close the Client Event Editor.

12. In the Cell Properties panel for the DynamicSelect control, make sure theVisiblefield is set toAlways. Do not change the values for the other fields. The properties panel should look like the following image.

13. Use the following steps to specify that the Price property of the HardwareItems embedded property is dis-played in the Price column.

a. Select the cell under the Price column heading to display its cell data in the properties panel. In the Propertyfield, use the SmartPrompt to select the Price property. In theControlfield, use the auto-complete to specify the CurrencyAmount control: type the first three characters (Cur), and the system displays a list of suggestions. If the All Matches tab is not selected, select it to see all matching results. Double-click CurrencyAmount to select it.

b. Make sure theVisiblefield is set toAlwaysand theRead Onlycheckbox is selected. Do not change the values in the remaining fields.

14. In the repeat grid, delete the two unused columns by clicking in a cell in the column and then clicking the Delete Column icon ( ). The grid should have the two columns Hardware and Price, and a third column for the delete icon ( ).

15. Click to save the SelectHardware section. Click the icon in its tab to close the rule form.

16. Following the procedure in steps 1 through 15 above, create another section called SelectSoftware. When you add the repeat grid, where you previously specified hardware-related values, specify the following items related to the software choices:

l In the Repeat Grid properties panel, make sure theSourceis set toProperty. In theList/Groupfield, use the SmartPrompt to specifySoftwareItems. Set theEdit ModetoRead/Write.

l Specify Software as the heading for the first column.

l For the DynamicSelect parameters, specify the following parameters:

Parameter Setting

Method for Generating Dynamic Select Select theActivityradio button.

Activity Information:

Applies To Use the SmartPrompt to select

Parameter Setting GLBX-Data-Software.

Activity Name After selecting the class for the

Applies Tofield, use the Smart-Prompt to selectgetSoftware.

Class of Returned Results Use the SmartPrompt to select:

GLBX-Data-Software.

Common DynamicSelect Information:

Select ID Software

Default Caption Select Software...

Property for Option Display pyLabel

Property for Option Value pyLabel

Enable Caching Select this checkbox.

The parameters form for the software DynamicSelect should look like the following image.

17. The section for selecting software items should look like the following image.

18. Save ( ) the SelectSoftware section. Click the icon in its tab to close the rule form.

Continue to the next tutorial topic.

In document Build Your First Application Pega (Page 91-101)