Including Pivot Grid Fluid Subpages in Application Pages

The Pivot Grid and Chart view and facets of the In Process Applicants model can be shown within the Job Openings application page.

If you select Open Jobs tile from the default HCM homepage, a fluid page with a list of open job positions, number of days open, number of people who have applied, and so on appears.

Image: Job Openings application fluid page

This example shows the Job Openings application fluid page listing open job positions, number of days open, number of people who have applied, and so on.

Job Openings application Fluid page

The HRMS analytics models include a Chart Only Pivot Grid model named In Process Applicants. This model presents data of applicants count. In addition, it has a collection of facets and prompts, such as Business Unit, Country, Applicant Name, Recruiter, and so on.

Image: In Process Applicants

This example shows the In Process Applicants Pivot Grid model.

In Process Applications

Application developers can create and include various views or subpages from a Pivot Grid model on the application fluid page. These views can be constructed by laying out the subpages in different combinations. In following sections you will use the In Process Applicants model within the Job Openings application page.

To include the Chart Only view and the search options of the In Process Applicants Pivot Grid model in the Job Openings application page:

  1. In Application Developer, open the application page for job opening HR_OPEN_JO_FLU.

    Image: Application Developer - HR_OPEN_JO_FLU

    This example shows the Application Developer with the application page HR_OPEN_JO_FLU opened.

    Application Designer - HR_OPEN_JO_FLU

  2. Insert the system search subpage PTS_NUI_SRCHSBP at level 0.

    Because the system search subpage PTS_NUI_SRCHSBP is not the search page, you should hide it using the psc_hidden style in the group box around this subpage.

  3. Insert the chart area PTS_NUI_CHARTAREA into the application page.

    Image: Application Developer - PTS_NUI_SRCHSBP and PTS_NUI_CHARTAREA are inserted into the application page

    This example shows the system search subpage PTS_NUI_SRCHSBP and chart area PTS_NUI_CHARTAREA inserted into the application page.

    Application Designer, system search subpage PTS_NUI_SRCHSBP and chart area PTS_NUI_CHARTAREA are inserted into the application page

  4. Add the following page activation PeopleCode to the application page HR_OPEN_JO_FLU.

    Note: The name of the global variables has to match the one shown below. The APIs are reused for component searches as well as Fluid views in Pivot Grid, therefore the name of the classes and packages are named as follows in the sample code.

    Important! The ComponentLife variable scope shown in the following example is valid in custom fluid search pages only. Custom fluid search page is a search page that is a custom replacement for the PeopleTools-delivered PTS_NUI_SEARCH page. The ComponentLife scope is not valid or supported in any other context.

    import PTS_SEARCH:PivotGridSearch;
import PTS_SEARCH:BaseSearch;
import PTS_SEARCH:Factory:DeviceSearchFactory;
ComponentLife PTS_SEARCH:BaseSearch &srch;
ComponentLife PTS_SEARCH:PivotGridSearch &srchPivotGrid;
ComponentLife string &sSrchPageName;
Declare Function HideChartSwitcher PeopleCode PTPG_NUI_WRK.PTPG_SHOWCHART FieldFormula;
Local PTS_SEARCH:Factory:DeviceSearchFactory &deviceFactory = create PTS_SEARCH:Factory:DeviceSearchFactory();
/*Initiate the pivot grid object. Pass the model and view name. The third parameter is empty for non-search views*/
&srchPivotGrid = &deviceFactory.GetPivotGridSearchObject(<Pivot Grid Name>, <View Name>, “”);
&srchPivotGrid.loadJavaScript_CSS();
&srch = &srchPivotGrid;
&srch.bUsePhoneLayout = &deviceFactory.bUsePhoneLayout;
&srch.SetSearchType("R");
&srch.bViewerMode = True;
&sSrchPageName = %Page;
&srch.SetSearchPageName(&sSrchPageName);
/*Initiate the layout*/
&srch.Initiate();
/*Render  the model*/
&srch.DoSearch();
/*Hide the chart on/off switcher. This is needed only for search view, not for pivot grid view.*/
HideChartSwitcher();

  5. Optionally, enable the Options Menu. See Enabling the Options Menu.

  6. Return to the application fluid page Job Openings.

    Image: Job Openings after the chart and the search options were inserted into the application page

    This example shows the rendered application fluid page Job Openings after the chart and the search options were inserted into the application page.

    Job Openings after the chart and the search options were inserted into the application page

  7. Optionally, you can change the chart types and other chart options using the application fluid page.

To include the chart, facets, and locator links on the application page:

  1. In Application Developer, open the application page for job opening HR_OPEN_JO_FLU.

    Note: The application page HR_OPEN_JO_FLU already includes the system search subpage PTS_NUI_SRCHSBP and chart area PTS_NUI_CHARTAREA.

  2. Insert the facet subpage PTS_NUI_FACETSBP and the locator link subpage PTS_NUI_BCRUMBSBP.

    Note: You can add the facet pane either before or after the chart area. If you add the facets before the chart in the layout order, remember to include a horizontal rule that is set to level zero before the chart area.

  3. Optionally, you can select a horizontal or vertical layout for both the chart and the facet.

    Note: You can apply the layout for the subpages horizontally using the style ps_box_horizontal for the group box surrounding them. Otherwise, you can apply the layout for the subpages vertically by using the style ps_box_vertical for the group box surrounding them.

    Image: Application Developer - PTS_NUI_SRCHSBP, PTS_NUI_CHARTAREA, PTS_NUI_FACETSBP, and PTS_NUI_BCRUMBSBP are inserted into the application page

    This example shows the application page for Job Openings HR_OPEN_JO_FLU, including the system search subpage PTS_NUI_SRCHSBP, chart area PTS_NUI_CHARTAREA, facet subpage PTS_NUI_FACETSBP, and locator link subpage PTS_NUI_BCRUMBSBP. This example includes a horizontal layout that uses the ps_box_horizontal style around the group-box for the subpages.

    Application Desinger - Job Openings includes the system search, chart area, facet , and locator link subpages

  4. Return to the application fluid page Job Openings.

    Image: Job Openings application page

    This example shows the rendered application fluid page Job Openings. The application page includes subpages to show a chart, search options, a facet, and locator links.

    The application page includes subpages to show a chart, search options, a facet, and locator links

  5. Optionally, you can apply facets on the results to narrow the size of the chart and add the locator links as in the classic Pivot Grid Viewer.

To include the chart, detail view results, and filters (prompts) on the application page:

  1. In Application Developer, open the application page for job opening HR_OPEN_JO_FLU.

    Note: The application page HR_OPEN_JO_FLU already includes the system search subpage PTS_NUI_SRCHSBP, chart area PTS_NUI_CHARTAREA, facet subpage PTS_NUI_FACETSBP, and locator link subpage PTS_NUI_BCRUMBSBP.

  2. Insert the results subpage PTS_NUI_RSLTSBP into the application page.

    Note: You are not required to add a horizontal rule set to level 0 before the results subpage and before the chart area subpage.

    Image: Application Developer - PTS_NUI_SRCHSBP, PTS_NUI_FACETSBP, PTS_NUI_BCRUMBSBP, PTS_NUI_CHARTAREA, and PTS_NUI_RSLTSBP are inserted into the application page

    This example shows the application page for job opening HR_OPEN_JO_FLU, including the system search subpage PTS_NUI_SRCHSBP, facet subpage PTS_NUI_FACETSBP, locator link subpage PTS_NUI_BCRUMBSBP, chart area PTS_NUI_CHARTAREA, and result subpage PTS_NUI_RSLTSBP.

    Application page for job opening shows the system search, facet, locator link, chart area, and result subpages

  3. Return to the application fluid page Job Openings.

    Image: Application fluid page Job Openings

    This example shows the rendered application fluid page Job Openings. The application page includes subpages of search options, facet, locator links, chart, and detail results view.

    Note: The facet will drive both the chart and the results view.

    Job Openings application page includes subpages of search options, facet, locator links, chart, and detail results view

  4. Optionally, you can remove the PTS_NUI_SRCHSBP subpage add the filter subpage PTS_NUI_FLTSBP to display the filters (prompts) in the view if the Pivot Grid model has prompts.

    Image: Application fluid page Job Openings

    This example shows the rendered application fluid page Job Openings. The application page includes subpages of prompts, facet, locator links, chart, and detail results view.

    Job Openings application page includes subpages of prompts, facet, locator links, chart, and detail results view

  5. Optionally, enable the Options Menu icon to display the view Pivot Grid layout option on the Chart Only model. See Enabling the Options Menu.

To include the Pivot Grid and Chart view on the application page:

  1. Access the Pivot Grid Wizard by selecting Reporting Tools, Pivot Grid, Pivot Grid Wizard.

  2. In the Pivot Grid Display page - Step 5, click the Configure Pivot Grid Views link to access the Pivot Grid View page and create an additional Pivot Grid and Chart view for the Pivot Grid model. Alternatively, access the Specify Data Model Options page - Step 4 and change the default view of the Pivot Grid model to Pivot Grid and Chart.

    For detailed steps to configure the pivot grid model through pivot grid wizard see, Specifying Data Model Options

    Also see, Viewing Pivot Grid Displays.

  3. In Application Developer, open the application page for job opening HR_OPEN_JO_FLU.

    Note: The application page HR_OPEN_JO_FLU already includes the system search subpage PTS_NUI_SRCHSBP and chart area PTS_NUI_CHARTAREA.

  4. Insert the grid area PTS_NUI_GRIDAREA next to the chart area PTS_NUI_CHARTAREA.

  5. Insert the horizontal rule set to level 0 before PTS_NUI_GRIDAREA and PTS_NUI_CHARTAREA.

    Note: You can apply the layout for the grid and chart areas horizontally using the style ps_box_horizontal for the group box surrounding them. Otherwise, you can apply the layout for the areas vertically by using the style ps_box_vertical for the group box surrounding them.

    Image: Application Developer - PTS_NUI_SRCHSBP, PTS_NUI_CHARTAREA, and PTS_NUI_GRIDAREA are inserted into the application page

    This example shows the application page for job opening HR_OPEN_JO_FLU, including the system search subpage PTS_NUI_SRCHSBP, chart area PTS_NUI_CHARTAREA, and grid area PTS_NUI_GRIDAREA. This example also includes a horizontal layout that uses the ps_box_horizontal style around the grid and chart areas.

    Job Openings application page includes subpages PTS_NUI_SRCHSBP, PTS_NUI_CHARTAREA, and PTS_NUI_GRIDAREA

  6. Return to the application fluid page Job Openings.

    Image: Application fluid page Job Openings

    This example shows the rendered application fluid page Job Openings. The application page includes a chart, search options, and a grid. The grid and chart areas are next to each other horizontally.

    Application fluid page Job Openings includes a chart, search options, and a grid

Note: You can include the facets and filters to the previous view. If you include the facets subpage, you can drag and drop between the facets and the grid as in the classic Pivot Grid Viewer. The drag-and-drop on the grid reflects the layout in the chart as well because the default view of the Pivot Grid model is Pivot Grid and Chart. Clicking the data point in the grid or chart displays the Detail View in a modal window by default. In a grid and chart view, the system cannot display the results grid on the face of the viewer because of space constraints.

To include the Pivot Grid Only view on the application page:

  1. Access the Pivot Grid Wizard by selecting Reporting Tools, Pivot Grid, Pivot Grid Wizard.

  2. Access the Pivot Grid Display page - Step 5 and click the Configure Pivot Grid Views link to access the Pivot Grid View page, where you can create an additional Pivot Grid Only view for the Pivot Grid model. Alternatively, access the Specify Data Model Options page - Step 4 and change the default view of the Pivot Grid model to Pivot Grid Only.

    For detailed steps to configure the pivot grid model through pivot grid wizard see, Specifying Data Model Options.

    Also see, Viewing Pivot Grid Displays.

  3. In Application Developer, open the application page for job opening HR_OPEN_JO_FLU.

  4. Remove the chart area PTS_NUI_CHARTAREA, if needed.

  5. Insert the grid area PTS_NUI_GRIDAREA.

  6. Optionally, insert the facet subpage PTS_NUI_FACETSBT and the filter subpage PTS_NUI_FLTSBP.

  7. Return to the application fluid page Job Openings.

    Image: Application fluid page Job Openings

    This example shows the rendered application fluid page Job Openings. The application page includes a grid, facet, and filters.

    Application fluid page Job Openings includes a grid, facet, and filters

To include the detail view with facets on the application page:

  1. In Application Developer, open the application page for job opening HR_OPEN_JO_FLU.

  2. Insert the system search subpage PTS_NUI_SRCHSBP, facet subpage PTS_NUI_FACETSBP, locator link subpage PTS_NUI_BCRUMBSBT, and result subpage PTS_NUI_RSLTSBP.

    Image: Application Developer - PTS_NUI_SRCHSBP, PTS_NUI_FACETSBP, and PTS_NUI_BCRUMBSBT, and PTS_NUI_RSLTSBP are inserted into the application page

    This example shows the application page for Job Opening HR_OPEN_JO_FLU, including the system search subpage PTS_NUI_SRCHSBP, facet subpage PTS_NUI_FACETSBP, locator link subpage PTS_NUI_BCRUMBSBT, and result subpage PTS_NUI_RSLTSBP.

    Application page for Job Opening includes the system search, facet, locator link, and result subpages

  3. Return to the application fluid page Job Openings.

    Image: Application fluid page Job Openings

    This example shows the rendered application fluid page Job Openings. The application page includes search options, facet, locator links, and detailed results view.

    The application page includes search options, facet, locator links, and detailed results view

To enable the Options Menu, which includes options to save the Pivot Grid model, reset personalizations, view the grid, download to Excel, and so on:

  1. Add the subpage PTS_NUI_HDR.

  2. Invoke this line at the end of the page activate code: &srchPivotGrid.createOptionsMenu();.

Note: To enable the View Pivot Grid layout on the Pivot Grid Chart-Only model, you need to enable the Options Menu that includes options to save the model, reset all personalizations, view the grid, download to Excel, and so on.