Portlet Factory, Version 6.1.2


 

Using the List builder: an example

You can use the List builder to create a list. This topic provides an example of one technique for doing this.

  1. In the model for the survey, make sure you have a method called main that calls up the page. If you selected Main_and_Page as the model type when you created the model, the method to call up the first page would have been added automatically in the Action List builder.

  2. Make sure a span tag has been created for a List builder and Button builder, as shown below:
    <html>
    <head><title>What are your hobbies?</title></head>
    <body><form>
    <div align="center" style="font:12pt Arial;font-weight: bold;color: #336699;">Please select your hobbies:</div>
    <div align="center">
    <span name="ListBuilderplaceholder"/><br>
    <span name="buttonplaceholder"/><br>
    </div>
    </form></body></html>

  3. Add a List builder call to the model, and do the following:

    1. Select the page from Step 2 and a placeholder for the List builder. For example, ListBuilderplaceholder.

    2. In the Source List Title field, enter a title for the source list. For example, Hobbies.

    3. In the Source List Options field, enter a list for the list of options. For example: Aerobics,Astronomy,Cooking,Reading,Running,Singing,Swimming.

    4. In the Target List Title field, enter a target for the title list. For example: Your Hobbies.

    5. From the Orientation menu, select horizontal. This item determines the orientation of the menu. The menu can be displayed vertically or horizontally with the default buttons in a row.

    6. Leave the rest of the fields blank.

  4. Add a Page builder call to the model. This page is used to display the items the user selected for the target list. Make sure it contains a span tag for the Text field. For example:
    <html><body><form>
    <div align="center" style="font:12pt Arial;font-weight: bold;color: #336699;"> You selected the following hobbies:
    <br>
    <font style="font:10pt Arial">
    <span name="displayText"/><br>
    </div>
    </form></body></html>

  5. Add a Button builder call to the model, and do the following:

    1. Select the page from Step 2 and the placeholder for the Button builder. For example, Buttonplaceholder

    2. In the Label field, type a label for the button. For example, Display Results.

    3. From the Action Type drop-down menu, select Submit form and invoke action.

    4. In the Action field, type the name of the page created in Step 4. For example, page2.

  6. Add a Variable builder call to the model of type String. This variable can be left blank, because it is used to store the target list at run time. Name the Variable builder target_list_display.

  7. Add a Text builder call to the model. Assign it to the page you created in Step 4. The results from the target list will be displayed in the location of the Text builder's span tag. In the Default Text field, enter an indirect reference to the variable created in Step 6. For example: ${Variables/target_list_display}

    Note: Make sure Allow HTML formatting of text, is selected.

  8. Add a Method builder call or a Linked Java Object builder call. The builder should contain the code you want to manipulate the values in the target list.

    The code below tells the Factory to go through the list of target values and print them. For example:

    { Iterator i = webAppAccess.getRequestInputs().getInputValues("ListBuilderplaceholder"); String results = ""; while (i.hasNext()) results += i.next(); results += "<br>"; webAppAccess.getVariables().setString("target_list_display", results);
    }

    where

    • ListBuilderplaceholder is the span tag assigned to the List builder created in Step 2.

    • results is the variable used to display the results.

    • target_list_display is the builder call name of the Variable builder created in Step 6.

    Note: The Text builder interprets the value of the results variable as HTML. Thus, the HTML break tag (<br>) was used to print each item on its own line, instead of \n, which would have been ignored by the web browser.

  9. Add an Event Handler builder call to the model. When the page created in Step 4 loads, the event handler triggers the method that contains the action you want.

    1. In the Name field, specify a builder call name for the Event Handler builder.

    2. From the Event Name select list, choose the OnPageLoad event for the page created in Step 4.

    3. In the Action field, use the pick list to select the method created in Step 8.

    When the page created in Step 4 loads, the event handler triggers the method that processes the List builder values.

  10. Run the model. Make some selections in the list builder and click the Display Results button. The second page should appear and it should display the values selected in the List builder.

  11. Instead of using a loop in the method to obtain the values, a Repeated Region builder could have been used. This technique lets you use fewer builders to achieve the same result. The following steps explain how you would modify the example above so you could use the Repeated Region builder:

    1. Remove the Variable, Event Handler, and Method builders from the model you created in the previous section.
    2. Add a span tag for the Repeated Region builder to page2, as shown below:
      <html><body><form>
      <div align="center" style="font:12pt Arial;font-weight: bold;color: #336699;"> You selected the following hobbies:
      <br>
      <font style="font:10pt Arial">
      <span name="repeatregionplaceholder">
      <span name="displayText"/><br>
      </div>
      </form></body></html>

      where

      • repeatregionplaceholder is the span tag for the Repeated Region builder.

      • displayText is the span tag for the Text builder.
    3. Add the Repeated Region builder call to the model, and do the following:

      1. In the Name field, name the Repeated Region builder.

      2. Assign the Repeated Region builder to the span tag you created in Step 2.

      3. In the Source Data Field, enter the following code:
        ${Java/webAppAccess.getRequestInputs().getInputValues("ListBuilderplaceholder")}

        • where ListBuilderplaceholder is the span tag assigned to the List builder

      4. In the Loop Variable enter the variable name target_list_display. If you enter a different name, modify the Default Text field in the Text builder so that it points to the correct variable.

    4. Run the model. Make some selections in the list builder and click the Display Results button. The second page should display the values selected in the List builder.

Parent topic: List builder


Library | Support |