Show TOC

Background documentationCreating the JSPDynPage Locate this document in the navigation structure

 

First step to create a portal component is to define a class that works as loader class - it inherits from the PageProcessorComponent. The created loader class (in the following example named ExampleOneDyn) executes the method getPage() and returns a unique value of the JSP DynPage we can use (in the following example named DynPageOne).

Syntax Syntax

  1. package com.mycompany.basicexample;
    
    import com.sap.htmlb.page.DynPage;
    import com.sap.portal.htmlb.page.PageProcessorComponent;
    
    public class ExampleOneDyn extends PageProcessorComponent {
    
      public DynPage getPage() { // Has to be overridden
    // Calls the DynPage and returns its value as DynPageOne
        return new DynPageOne();  }
    }
    
End of the code.

Note Note

The SAP EP Developer Plug-ins provide a JSP Dynpage wizard, that creates all necessary classes, beans and JSP for a JSP Dynpage.

End of the note.

The class DynPageOne is extended from the DynPage class. Following methods have to be overwritten:

  • doInitialization

    Called when the application is started. The call is made when the page is directly called per URI without parameters and no event occurred.

    Usually this method is used to initialize data and to set up models. Be aware of the fact that the doInitialization event is also caused when another portal component on the same page sends an event.

    Example Example

    With the "Personalize" Dialog you can compose a page by grouping several portal components together. We have created a page called myPage with two portal components - A and B. When calling the page myPage the doInitialization is called from portal component A and B followed by the call of the method doProcessBeforeOutput. When an event occurs in the portal component B (for example, by clicking on a button), the doInitialization method in portal component A is called again, while in portal component B the method doProcessAfterInput followed by the event handling method assigned for the button and finally the doProcessBeforeOutput method.

    End of the example.

    To create solid portal components you must be aware of the fact and check in the doInitialization method if the data has already been initialized or the models have been created. Otherwise you portal component is always reset to the initial state if an event in another portal component occurs.

    The Enterprise Portal treats every portal component isolated. In this case an event in one portal component does not cause the doInitialization event in the other portal component on the same page. The PDK can emulate this behavior by setting the ISOLATED flag in the page description XML file to true. The page description XML file in the content folder of the page and defines the position of the portal component, height and tray type.

    Example Example

    Example for an entry in the XML file:

    <component name="AAA.default" title="AAA.default" height="400" trayType="SAPTrayD3" Position="1"/>

    Example for an entry in the XML file with isolation flag set so that PDK behaves like the Enterprise Portal:

    <component name="AAA.default" title="AAA.default" isolated="true" height="400" trayType="SAPTrayD3" Position="1"/>

    End of the example.

    If you use the Page Editor in the DevTools section of the PDK you can set the isolated flag interactively.

  • doProcessAfterInput

    Called when the web client sends the form to the web server. Except on doInitialization (see above) the call is performed every time an event occurs.

  • doProcessBeforeOutput

    Called before the form is sent to the web client. The call is performed every time even on doInitialization.

In our example we only use the doProcessBeforeOutput method, the other methods stay "empty".

Syntax Syntax

  1. package com.mycompany.basicexample;
    import com.sap.htmlb.*;
    import com.sap.htmlb.enum.*;
    import com.sap.htmlb.page.PageException;
    import com.sap.portal.htmlb.page.JSPDynPage;
    
    public class DynPageOne extends JSPDynPage {
    
        /*   Constructor  */
        public DynPageOne() {
            this.setTitle("DynPageOne");
        }
    
        /*   Used for user initialization. Called when the application is 
         *   started   */
        public void doInitialization() {
        }
    
        /* 
        * Used for handling the input.Generally called each time when an 
        * event occurs on the client side.
        */
        public void doProcessAfterInput() throws PageException {
        }
    
        /*   Used for handling the output. This method is always called.
             In our example the JSP makes a textView that displays
             "May the force be with you unknown user".       */
    
        public void doProcessBeforeOutput() throws PageException {
            // set the JSP which builds the GUI
            this.setJspName("OutputText.jsp");
        }
    }
    
End of the code.

JSP - OutputText.jsp - that is called by doProcessBeforeOutput

Syntax Syntax

  1. <%-- OutputText.jsp --%>
    <%@ taglib uri= "tagLib" prefix="hbj" %>
    <hbj:content 
        id="myContext">
        <hbj:page 
            title="An Easy Start">
            <hbj:form>
                <hbj:textView 
                    id="welcome_message"
                    text="May the force be with you unknown user"
                    design="HEADER1"
                    />
            </hbj:form>
        </hbj:page>
    </hbj:content>
    
End of the code.

Deployment descriptor: Necessary entries to execute this portal component:

Syntax Syntax

  1. <application>
        <application-config>
            <property 
                name="SharingReference"
                value="htmlb"/>
        </application-config>
        <components>
            <component 
                name="default">
                <component-config>
                    <property 
                        name="ClassName"
                        value="com.mycompany.basicexample.DynPageOne"/>
                    <property 
                        name="SecurityZone"
                        value="com.sap.pct.pdk/low_safety"/>
                </component-config>
                <component-profile>
                    <property 
                        name="tagLib"
                        value="/SERVICE/htmlb/taglib/htmlb.tld"/>
                </component-profile>
            </component>
        </components>
        <services/>
    </application>
    
End of the code.

The entry for ClassName is case sensitive. The entry SharingReference makes sure, that the necessary HTMLB libraries are found.

The strength of the JSP DynPage is the event handling. The JSP DynPage follows the concept of Java controls (for example, Swing) - Java controls, like the HTMLB controls, can have one or more events. You define the event by assigning a method name to the event. The method is called whenever the event is raised (for example, when a button is clicked). The event handling method is coded in the JSP DynPage. The JSP DynPage does the event handling and calls the proper event handling method.

Next step in our example is to place a button to our user interface and define an event for it.