Chat now with support
Chat with Support

Foglight 5.9.1 - 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

Additional activities

Notice the small i in the table’s top-right corner. Click it to see help for the table. Any text you placed in the Context Help box (see Step 13 on page 36) appears in a tooltip when the help icon is activated.

Notice the edit icon at the right-hand side of the table’s column header. Clicking it launches a customizer. It isn’t too useful right now because the table contains only one column, but if a table contains many columns this customizer gives the end user the option of temporarily hiding some of the columns. Also, the Export action allows the user to save a copy of the table in CSV, PDF, Excel and XML formats.

Because you gave the dashboard a title, it appeared at the top of the component. Experiment with giving the table another title.

To give the table another name:
1
Start editing the Monitored Hosts table, and open its Configuration tab.
2
In the row containing the Title property, in the Value column, click Edit , and from the menu that appears, choose Set to Binding > String Template.
3
In the Edit - Title dialog box that appears, in the Value box, type Hosts Monitored by Foglight.
4
Save your changes, both in the dialog box and in the view component, and observe the table title on the All Hosts dashboard.
To show or hide a title for the table:
1
Whether the table’s title shows or not is dictated by a property in the All Hosts dashboard. Open it for editing and open the Layout tab.
2
On Layout tab, click anywhere in the Monitored Hosts area.
3
Click the Properties tab.
4
In the Properties dialog box that appears, clear the Show Title and Show Border check boxes.
 
* 
IMPORTANT: You can change the width of the table here, too.
5
Save the changes and view the result. Observe that there is no title and no border around the table.
6
Return to the Properties dialog box, select the Show Title and Show Border check boxes, save your changes and view the result. Observe the table title.
 
* 
NOTE: You may notice that the column containing host names has a heading whose value is Name, which is derived from the property chosen for this column in the context selection (<currentRow>/name). The header can be changed by editing the column’s Header property. To do that, in Monitored Hosts table, select the Show Advanced Properties check box, and navigate to Columns > Column > Header.

Saving the Tutorial2 module

There is a command-line option in fglcmd that allows you to export and import modules. This procedure assumes that your Foglight™ installation is in the default location on a Windows® machine. Make the appropriate changes for other platforms. It also assumes that your user name is tutorial. Note that all objects in the module are saved.

For complete information about the fglcmd utility, see the Command-Line Reference Guide.

To copy fglcmd to your machine:
•
Log on to the server machine and type:
cd C:\Quest_Software\Foglight\tools
Copy fglcmd to your machine.
To export your module using fglcmd:
•
In the directory where you placed fglcmd, issue the command:
fglcmd -usr tutorial -pwd <password> -cmd util:uiexport -m user:tutorial -f \C:\pub\Tutorial\Tutorial2.zip.
To import a module you have exported:
•
fglcmd -srv <serverName> -usr tutorial -pwd <password> -cmd util:uiimport -f C:\pub\Tutorial\Tutorial2.zip
 
* 
IMPORTANT: When you load a module it completely replaces the contents of the module. Any definitions you may have placed there are lost.

Tutorial 3: Adding a Drilldown Page

In Tutorial 2 you created a top level dashboard that contains a table of host names. Now, in Tutorial 3, it is time to show you how to add more columns to the table and how to create a dependent page that supplies information about any host selected from the table. This is often called a drilldown page because the information it presents depends on the object selected in the parent page.

User actions that cause the view to update in some way will be covered in a subsequent tutorial.

•
Preliminary Setup
•
Adding a Column of Aggregate Alarms to the Table
•
Adding a Dependent Page
•
Summary
Objectives of Tutorial 3

There are two main ways of presenting visual information about a group of objects. One is to list objects on a page and to organize it so that the information about each object appears with it on the same page. We chose a table layout in Tutorial 2 with this objective in mind. We can add other bits of information to the same row as the host and keep things together that way.

The other way of presenting information is as separate pages, one for each item in the original list. This way is appropriate when the visual component presenting the information is too large to fit on the parent page.

The objectives of Tutorial 3 are:

•
Add columns to the table of hosts to show the aggregate alarm state. This places visual information about the host on the row adjacent to its name.
•
Add a drilldown page that presents information about the chosen host. This permits you to show much more information about each individual host.

The primary objective of this tutorial is to demonstrate the addition of a drilldown page whose content depends on the particular choice made in the parent page, and in so doing, demonstrate the use of a context and a flow. The terms context and flow are described in detail in the <Emphasis>Web Component Guide.

Preliminary Setup

You are going to build on Tutorial 2 here, but it is a good idea to keep the work you did on Tutorial 2 intact so that you can reuse it if necessary. If you want to keep the tutorials separate, create a new user and copy Tutorial 3 to the new workspace. If you are creating views as you read this tutorial, it is a good idea to start fresh and copy Tutorial 2 to Tutorial 3.

To copy the Tutorial 2 module to Tutorial 3:
1
Create a new Foglight user (tutorial3, tut0rial), as you did for Tutorial 2.
2
Log in to Foglight as tutorial3.
3
On the navigation panel, choose Configuration > Definitions.
4
In the Module List pane, choose Other User Definitions > tutorial2.
5
In the Module Contents pane, click the drop-down list, and select Views.
6
In the list of views, select All Hosts.
The Definitions pane shows the configuration of the All Hosts view.
7
Click Copy and from the menu that appears, choose Deep.
8
In the Copy dialog box that appears, in the Select a target module area, choose My Definitions and click OK.
Since you are logged in as user tutorial3, you now have a separate copy of the module you created in Tutorial 2. You can use this copy to continue your work in Tutorial 3 without affecting the work you did for Tutorial 2.
To add a context entry to All Hosts:
1
In Tutorial 3, open the All Hosts view for editing.
2
Open the Context tab.
3
In the Inputs table, click Add Input .
4
In the newly added row, in the Key column, type host.
5
Leave the Name column unchanged.
You can set a name to be more descriptive than the key. This can be useful when configuring reports that require context inputs to be set. Using a descriptive name may help the person understand the purpose of the context key.
6
Click the Usage column and choose Internal from the list that appears.
Later in this tutorial, you will set a flow to Host Monitor in Monitored Hosts, and pass a key named host as the context mapping for the selected row that triggers the flow action. Setting the same context as Internal here tells the layout that one of its children supplies the value. This step is not strictly required for the current tutorial, but it is a pattern that should be followed as a matter of course because other situations require it.
It often happens that you design a dashboard that should update itself based on a choice the user makes in a contained view. For instance, you might define an Update flow on a row of a table in the dashboard. The context mechanism sends the key up to the dashboard, but without a context declaration at that level, the dashboard can not send the context back to the table it contains. Thus, the table does not receive any context information from its parent. In this case, the table uses its default value of the context from a time before the current row was selected. The new context information is lost, and the view updates itself based on the old context. This situation is avoided by defining an Internal context at the dashboard level. This tells the dashboard to retrieve the value for this key from one of its child components. Upon an update, the dashboard receives the key and sends it on to all its children. Those that define the same context key can use it.
7
Leave the List column set to False.
8
In the Data Type column, type Monitoring:Host.
9
Set a fallback value. Choose null and ignore the warning message because the context value will be used in a child view later on in this tutorial.
10
Click Save on the dialog box and on the tab on All Hosts’ toolbar to save your work so far.
Related Documents

The document was helpful.

Select Rating

I easily found the information I needed.

Select Rating