Show TOC

Procedure documentationUsing the Script Assistant

Procedure

  1. On the SAP MII administration menu, choose Start of the navigation path Content Development Next navigation step Workbench. End of the navigation path

    The SAP MII Workbench screen appears.

  2. On the Web tab, create or select a file.

  3. Click the up arrowhead (Open Display Pane) on the bottom left of your file tab.

    The Script Assistant tab appears.

  4. Select an applet/i5Chart/i5Grid to which you want to create a link.

  5. Select an applet/i5Chart/i5Grid method.

  6. Select an object method. For example, select getQueryObject.

  7. Click Insert.

    For applets, the system pastes the applet.getQueryObject and for i5Charts, i5Chart.getQueryObject method into the text area.

  8. Click Save.

    The system inserts the JavaScript text into the script block.

    Note Note

    You can manually edit the script in the text area or create it on the page and edit it in the HTML view.

    End of the note.

For more information, see Script Assistant.

Example

Applets

You are using the Script Assistant in SAP MII Workbench and have an .html page that contains the BatchTrend and BatchList applets. The definition for the BatchTrend applet is:

<APPLET NAME="BatchTrend" WIDTH="715" HEIGHT="45" CODE="iGrid" CODEBASE="/Illuminator/Classes" ARCHIVE="illum8.zip" MAYSCRIPT>

<PARAM NAME="QueryTemplate" VALUE="Training/BatchTrendQuery">

<PARAM NAME="DisplayTemplate" VALUE="Training/BatchTrendChart">

</APPLET>

The definition for the BatchList applet is:

<APPLET NAME="BatchList" WIDTH="715" HEIGHT="45" CODE="iGrid" CODEBASE="/Illuminator/Classes" ARCHIVE="illum8.zip" MAYSCRIPT>

<PARAM NAME="QueryTemplate" VALUE="Training/BatchListQuery">

<PARAM NAME="DisplayTemplate" VALUE="Training/BatchListGrid">

</APPLET>

On the Script Assistant screen, you select the BatchList applet as the target. The system uses SelectionEvent to call the BatchList_Selected function. You select the BatchTrend applet, the getQueryObject() object, and a corresponding setParam(Index, Value) object method. When you click Insert, the system inserts the document.BatchTrend.getQueryObject().setParam(INDEX, NEWVALUE); expression into the text area. When you click Save Script, the following changes are made to the applet and the JavaScript:

  • The system creates a new function with a unique ID and places it in the header of the Web page inside its own script block.

    <SCRIPT Language="JavaScript" id="BatchList_Updated">

    function BatchList_Selected() {

    document.BatchTrend.getQueryObject().setParam(INDEX, NEWVALUE);

    }

    </SCRIPT>

  • The BatchList applet includes an additional parameter name-value pair with Name=SelectionEvent, which is shown below before the </Applet> tag:

    <APPLET NAME="BatchList" WIDTH="715" HEIGHT="45" CODE="iGrid" CODEBASE="/Illuminator/Classes" ARCHIVE="illum8.zip" MAYSCRIPT>

    <PARAM NAME="QueryTemplate" VALUE="Training/BatchListQuery">

    <PARAM NAME="DisplayTemplate" VALUE="Training/BatchListGrid">

    <PARAM NAME="SelectionEvent" VALUE="BatchList_Selected">

    </APPLET>

    Note Note

    This is a simple example and requires additional logic to be functional.

    End of the note.
i5Charts

You use the Script Assistant to create an i5Chart. The definition to create an i5Chart is:

Syntax Syntax

  1. <SCRIPT language="JavaScript">
  2. var i5Chart = new com.sap.xmii.chart.hchart.i5Chart("KM/i5Chart_PR", "KM/XMLQuery_PR");
  3. i5Chart.setChartSize("700px","600px");
  4. Chart.draw("div1"); 
  5. </SCRIPT>
End of the code.

On the Script Assistant screen, you select i5Chart, the getQueryObject(), and a corresponding getParameter(name) object method. When you click Insert, the system inserts the i5Chart.getQueryObject().setParameter(INDEX, NEWVALUE) expression into the text area. Save the script.

i5Grids

You use the Script Assistant to create an i5Grid. The definition to create an i5Grid is:

Syntax Syntax

  1. <SCRIPT language="JavaScript">
  2. var i5Grid= new com.sap.xmii.grid.init.i5Grid("KM/i5Chart_PR", "KM/XMLQuery_PR");
  3. i5Grid.setChartSize("700px","600px");
  4. Grid.draw("div1"); 
  5. </SCRIPT>
End of the code.

On the Script Assistant screen, you select i5Grid, the getQueryObject(), and a corresponding getParameter(name) object method. When you click Insert, the system inserts the i5Grid.getQueryObject().setParameter(INDEX, NEWVALUE) expression into the text area. Save the script.