Chat now with support
Chat with Support

Foglight 6.0.0 - Web Component Tutorial

Using the Web Component Tutorial Tutorial 1: Drag and Drop Tutorial 2: Creating a Dashboard Tutorial 3: Adding a Drilldown Page Tutorial 4: Adding Views Tutorial 5: Using a Grid Tutorial 6: Reports Tutorial 7: Creating a Form Tutorial 8: Renderers Tutorial 9: Adding Questions and Answers Tutorial 10: Sending Messages to Other Users

Defining the Functions for Adding and Removing a Manager

To create the Add Manager function:
1
In the Module Contents pane, click the drop-down list, select Functions, and click Add .
The Add Function dialog box appears.
2
Create the Add Manager function using the information provided below. Define two parameters, company and newManager, as illustrated below, to pass in values required by the function.
Figure 8. Add Manager function
To create the Remove Manager function:
1
In the Module Contents pane, click the drop-down list, select Functions, and click Add .
The Add Function dialog box appears.
2
Create the Remove Manager function using the information provided below.
Figure 9. Remove Manager function

Defining the Labels

To create labels for the Bean Input fields:
1
In the Module Contents pane, click the drop-down list, select Views, and click Add .
The Add Views dialog box appears.
2
Create four labels: Label: First Name, Label: Last Name, Label: Title, and Label: Employee’s ID.
3
When setting their Label property on the Configuration tab, choose Set to Binding > Localized String from the menu, and set the component labels as follows:
•
Label: First Name: First Name:
•
Label: Last Name: Last Name:
•
Label: Title: Title:
•
Label: Employee’s ID: Employee’s ID:
4
For each label, set their Horizontal Alignment property to Right.

Defining the Bean Input Components

To create the Bean Input components:
1
Start by creating the Manager First Name Bean Text Field view. Still in the view editor, click Add.
2
In the Add View dialog box that appears, on the Create a Blank View tab, choose Bean Inputs > Bean Text Field.
3
Create the Bean Text Field view using the information provided below.
Figure 10. Manager First Name Bean Text Field
TIP: The Path To Value property is easily set because the only context passed to these components is a Manager type.
4
Create two more Bean Input components: the Manager’s Title Bean Drop-Down List and Manager’s ID Number Bean Number Input. Use the information provided below to populate the components’ values.
Figure 11. Manager’s Title Bean Drop-Down List
Figure 12. Manager’s ID Number Bean Number Input

Defining the Grid Layout

To create the Grid Layout for the data collection fields:
•
Still in the view editor, create a Grid Layout view using the following values.
Figure 13. Grid Layout View
 
* 
IMPORTANT: The manager key is the only required context input.
This tutorial demonstrates the reduction in the number of context-required entries by using Bean Input components. Without them, context keys are required for all the fields in the Company structure. If this were a real application, with perhaps dozens of fields, the saving in overhead would be much greater.
Figure 14. First Name Label
The settings for Last Name are similar to those of First Name, but these values are placed in row 1.
Figure 15. Title Label
Figure 16. Employee’s ID Label
Related Documents

The document was helpful.

Select Rating

I easily found the information I needed.

Select Rating