Here's a quick example of how to leverage the out of the box tables on your own WebCenter Content Components:

In your resources file, there will be a few dynamicincludes that you'll need to define. Let's first walk through the parent include, which will contain the triggers for the rest of the table.

[[% table - account master home %]]

<@dynamichtml account_table@>

<$exec inc("setup_account_table_header")$>

<$include slim_table_header$>

<$exec inc("setup_account_table_row")$>

<$exec inc("setup_account_action_popups")$>

<$exec inc("create_action_popup_container_include")$>

<$exec inc("create_slim_table_row_include")$>

<$loop ACCT_SEARCH_RESULTS$>

<$include slim_table_row_include$>

<$endloop$>

<$include slim_table_footer$>

<@end@>

The first called include is "setup_account_table_header". This defines the columns for the table.

The key points are that it initially creates a resultset to contain the values. That's the "ColumnProperties" resultset which has a specific set of fields:

id - the id for the column, which is used in a subsequent include to map values back to this column

width - the width of this column, in pixels or percent

headerLabel - the label of this column, you can use a localized string, if desired

headerURL - the URL that should be used if you want the column label to be clickable. This is typically used to offer column sorting.

rowAlign - 'center'/'left'/'right, the text alignment you want to use for the column

<@dynamichtml setup_account_table_header@>

<$UseRowHighlighting = 1, ShowRemove=1$>

<$exec rsCreateResultSet("ColumnProperties", "id,width,headerLabel,headerURL,rowAlign")$>

<$exec rsAppendNewRow("ColumnProperties")$>

<$exec setValue("ColumnProperties", "id", "selection")$>

<$exec setValue("ColumnProperties", "width", "5%")$>

<$exec setValue("ColumnProperties", "headerLabel", "ww_AMselect")$>

<$exec setValue("ColumnProperties", "rowAlign", "center")$>

<$exec rsAppendNewRow("ColumnProperties")$>

<$exec setValue("ColumnProperties", "id", "acct")$>

<$exec setValue("ColumnProperties", "width", "10%")$>

<$exec setValue("ColumnProperties", "headerLabel", "ww_AMAcct")$>

<$fieldName = "acct"$>

<$exec setValue("ColumnProperties", "headerURL", "#" & fieldName)$>

<$exec setValue("ColumnProperties", "rowAlign", "center")$>

<$exec rsAppendNewRow("ColumnProperties")$>

<$exec setValue("ColumnProperties", "id", "cname")$>

<$exec setValue("ColumnProperties", "width", "60%")$>

<$exec setValue("ColumnProperties", "headerLabel", "ww_AMCname")$>

<$fieldName = "cname"$>

<$exec setValue("ColumnProperties", "headerURL", "#" & fieldName)$>

<$exec setValue("ColumnProperties", "rowAlign", "left")$>

<$exec rsAppendNewRow("ColumnProperties")$>

<$exec setValue("ColumnProperties", "id", "cont_st")$>

<$exec setValue("ColumnProperties", "width", "10%")$>

<$exec setValue("ColumnProperties", "headerLabel", "ww_AMContSt")$>

<$fieldName = "cont_st"$>

<$exec setValue("ColumnProperties", "headerURL", "#" & fieldName)$>

<$exec setValue("ColumnProperties", "rowAlign", "center")$>

<$exec rsAppendNewRow("ColumnProperties")$>

<$exec setValue("ColumnProperties", "id", "actions")$>

<$exec setValue("ColumnProperties", "width", "15%")$>

<$exec setValue("ColumnProperties", "headerLabel", "wwActions")$>

<$exec setValue("ColumnProperties", "rowAlign", "center")$>

<@end@>

For this example, the next include you need to define is the "setup_account_table_row" include.

This is where you load the data for each row of the table. note that you're populating a resultset named "RowData" with three arguments:

rsetname - Always will be "RowData", for this example

id - the id of the column to be populated; as defined in ColumnProperties above

value - the value that will be included in the table cell.

Note that I've scoped all of my values to the 'ACCT_SEARCH_RESULTS' resultset. You'll notice we're looping that resultset in the 'account_table' include.

Also notice that there's one 'PopupData' entry as well. We'll cover that further below, as that's the data for the popup menu that we're building at the same time as the rest of the row data.

<@dynamichtml setup_account_table_row@>

<$exec setValue("RowData", "selection", "<input type='checkbox' id='<$ACCT_SEARCH_RESULTS.ACCTID$>'/>")$>

<$exec setValue("RowData", "acct", "<$ACCT_SEARCH_RESULTS.ACCT$>")$>

<$exec setValue("RowData", "cname", "<$ACCT_SEARCH_RESULTS.CNAME$>")$>

<$exec setValue("RowData", "cont_st", "<$ACCT_SEARCH_RESULTS.CONT_ST$>")$>

<$exec setValue("RowData", "actions", "<$include account_action_icons$>")$>

<$exec setValue("PopupData", "actions", "<$include action_popup_container_include$>")$>

<@end@>

Next is a separate include that defines the values we'll use for the 'actions' column. You'll see that we call this include during the row-building include directly above.

We're doing two things here. We include the 'action_popup_image' include, which is an out-of-the-box function that will build the popup for us. Then, we add an icon that's wrapped in an anchor that will allow us direct access to another page.

<@dynamichtml account_action_icons@>

<$include action_popup_image$> <a href="<$HttpCgiPath$>?IdcService=GET_ACCOUNT&acctid=<$ACCT_SEARCH_RESULTS.ACCTID$>&control=view" >

<img src="<$lm_info_image$>" height="16" width="16" border="0"></a>

<@end@>

Although we've configured where we call the popup, we have not yet defined where we define what's actually in the popup. We do that in the 'setup_account_action_popups' include.

You see that we create a resultset named 'PopupProps' with some specific fields.

Notice that you can flag whether an entry is a group and allows children or not. The 'id' and 'parentid' keys tie entries together into the hierarchy.

You can set the target functionality per item using the 'function', 'href', or 'onClick' fields. 'href' will accept standard urls only, 'onClick' will accept javascript functions, and 'function' will accept either (javascript requires a 'javascript:' prefix).

**See below for a full explanation on these fields.

<@dynamichtml setup_account_action_popups@>

<$doingPopupActions = 1$>

<$exec rsCreateResultSet("PopupProps", "label,function,class,id,ifClause,linkTarget")$>

<$exec rsAppendNewRow("PopupProps")$>

<$exec setValue("PopupProps", "label", lc("ww_AMAccounts"))$>

<$exec setValue("PopupProps", "function", "")$>

<$exec setValue("PopupProps", "class", "document")$>

<$exec setValue("PopupProps", "isGroup", "true")$>

<$exec setValue("PopupProps", "id", "Accountparent")$>

<$exec rsAppendNewRow("PopupProps")$>

<$exec setValue("PopupProps", "label", lc("ww_AMviewAccount"))$>

<$exec setValue("PopupProps", "function", "<$HttpCgiPath$>?IdcService=AM_GET_ACCOUNT&acctid=<$ACCT_SEARCH_RESULTS.ACCTID$>&control=view")$>

<$exec setValue("PopupProps", "href", "")$>

<$exec setValue("PopupProps", "class", "document")$>

<$exec setValue("PopupProps", "isGroup", "true")$>

<$exec setValue("PopupProps", "id", "accountview")$>

<$exec setValue("PopupProps", "parentId", "Accountparent")$>

<$exec rsAppendNewRow("PopupProps")$>

<$exec setValue("PopupProps", "label", lc("ww_AMeditAccount"))$>

<$exec setValue("PopupProps", "function", "<$HttpCgiPath$>?IdcService=AM_GET_ACCOUNT&acctid=<$ACCT_SEARCH_RESULTS.ACCTID$>&control=edit")$>

<$exec setValue("PopupProps", "href", "")$>

<$exec setValue("PopupProps", "class", "document")$>

<$exec setValue("PopupProps", "isGroup", "true")$>

<$exec setValue("PopupProps", "id", "accountedit")$>

<$exec setValue("PopupProps", "parentId", "Accountparent")$>

<$exec rsAppendNewRow("PopupProps")$>

<$exec setValue("PopupProps", "label", lc("ww_AMdeleteAccount"))$>

<$exec setValue("PopupProps", "onClick", "accountDelete('<$ACCT_SEARCH_RESULTS.ACCTID$>')")$>

<$exec setValue("PopupProps", "class", "document")$>

<$exec setValue("PopupProps", "isGroup", "true")$>

<$exec setValue("PopupProps", "id", "accountdelete")$>

<$exec setValue("PopupProps", "parentId", "Accountparent")$>

<$exec rsAppendNewRow("PopupProps")$>

<$exec setValue("PopupProps", "label", lc("ww_AMmiscInfo"))$>

<$exec setValue("PopupProps", "function", "<$HttpCgiPath$>?IdcService=AM_GET_ACCOUNT&acctid=<$ACCT_SEARCH_RESULTS.ACCTID$>&control=misc")$>

<$exec setValue("PopupProps", "href", "")$>

<$exec setValue("PopupProps", "class", "document")$>

<$exec setValue("PopupProps", "isGroup", "true")$>

<$exec setValue("PopupProps", "id", "accountmisc")$>

<$exec setValue("PopupProps", "parentId", "Accountparent")$>

<$exec rsAppendNewRow("PopupProps")$>

<$exec setValue("PopupProps", "label", lc("ww_AMserviceOrders"))$>

<$exec setValue("PopupProps", "function", "")$>

<$exec setValue("PopupProps", "class", "document")$>

<$exec setValue("PopupProps", "isGroup", "true")$>

<$exec setValue("PopupProps", "id", "soparent")$>

<$exec rsAppendNewRow("PopupProps")$>

<$exec setValue("PopupProps", "label", lc("ww_AMlistServiceOrders"))$>

<$exec setValue("PopupProps", "function", "<$HttpCgiPath$>?IdcService=AM_SEARCH_SERVICEORDERS&so_acctid=<$ACCT_SEARCH_RESULTS.ACCTID$>&acctparamorderby=createdate&acctparamorderdir=desc&isSubstring=0")$>

<$exec setValue("PopupProps", "class", "document")$>

<$exec setValue("PopupProps", "id", "solist")$>

<$exec setValue("PopupProps", "parentId", "soparent")$>

<@end@>

Lastly, you include the table in your template by dropping in the include where you want the table to render:

<$include account_table$>

Note that popup menus are fairly forgiving compared to menubars. Menubars tend to require a bit more attention when configuring. I'll create a separate post for that in the near future.

I hope this helps out!

-ryan

-----------------

The included comments on table creation from std_page.idoc:

[%%

%% Create an include for rendering menus (e.g. menubar or popup menus).

%% @param menuRsetName (required) name of result set which contains the menu item and submenu

%% definitions. This result set's columns include:

%% id: (required) identifier for this node.

%% parentId: (optional) Used for nodes belonging to a menu group (e.g. submenus). The

%% value is the group "id", pointing to another row in this result set.

%% class: (recommended) describes a collection of menu nodes; for example, this column

%% may be used to display or not display a set of menus. Suggested value for this

%% column is the name of the component which defines this result set.

%% label: (required) presentation string for this menu node. NOTE: This column contains

%% the localized values of the display labels. An alternative to this column is

%% using labelKey and labelArgs*, where the label column will be auto-generated.

%% labelKey: (optional) presentation string key for this menu node. If this column is

%% present, the label column's values will be generated from this string but only if

%% the "label" value is empty.

%% labelArg*: (optional) arguments for the presentation strings. The columns are named

%% "labelArg1", "labelArg2", ... as needed.

%% href: (recommended, for menu items) hyperlink which is activated when this menu is

%% selected. The value should contain the protocol, e.g. a "javascript:" prefix for

%% activating javascript code. Default value: "#".

%% loadOrder: (recommended) numeric value describing the order in which menu nodes

%% appear. Smaller values mean items will appear higher in the list.

%% ifClause: (optional) if present, this column is evaluated (idocscript) and if false,

%% this menu node is hidden. If not present, this node is always displayed. Useful

%% for popup menus whose menus vary on a per-item basis. Not intended to show or

%% hide menu bar items.

%% linkTarget: (optional) link target name (the "target" attribute of the anchor element).

%% flags: (optional) currently supported flags include:

%% "isGroup" - (parent nodes) instead of creating a submenu, inline the members of

%% this menu group (all nodes with the same parentId) and separate the group from

%% other groups using a visual divider (i.e. horizontal line).

%% preDisplayInclude: (optional) execute this include for each row in the result set

%% before rendering the javascript to create the menus. This include should not

%% output anything of importance.

%% @param menuIncludeName (required) include to create. Use this resulting include to render

%% the menu nodes on the page.

%% NOTE: If this menu is to be used in the page's header, you should also set

%% headerMenuInclude to this value before std_page_heading is included. Doing so

%% will render these menu nodes as part of the page header.

%% @param menuType (optional) one of:

%% "menuBar" - common menubar

%% "simpleMenuBar" - simplified menubar

%% "imagePopup" - (default) popup menu tied to an image

%% "menuData" - only render the javascript array, not the surrounding script tags.

%% @param menuBarType (required for menubar types) "header" or "list".

%% @param menuFlags (optional) currently supported flags include:

%% "skipMenuCounter" - Don't number the menu nodes (in the object IDs).

%% "useCustomMenuItemPrefix" - prepend #local.customMenuPrefix to the object IDs.

%% @param menuBarClass (optional) override the menubar's CSS class.

%% @param menuBarContainerClass (optional) override the menubar's container CSS class.

%% @param menuBarRoundedCorners (optional)

%%]

Saturday, January 12, 2013

Oracle Database 11.2.0.3

Tuesday, December 18, 2012

Using WebCenter Content's Out of the Box Tables and Popup Menus

Here's a quick example of how to leverage the out of the box tables on your own WebCenter Content Components: