Example: Using Extensions in BSP Pages (SAP Library - Defining Your Own BSP Extension)

Example: Using Extensions in BSP Pages

The following example shows the realization of a simple Web user interface for a BSP application using the HTMLB library HTMLB. This library is available in each SAP Web Application Server System and can be imported within the workbench from the Tag Browser into any BSP page.

This example contains a label, input, and pushbutton element – in addition to the content, page, and form elements - for simple selection of flight data. The flight data is displayed using a TableView element.

<%@page language="abap"%>

<%@ extension name="htmlb" prefix="ui" %>

<ui:content>

<ui:page>

<ui:form>

<ui:label id = "myLabel"

for = "carrier"

text = "Airline"

design = "LABEL"

width = "65" />

<ui:inputField id = "carrier"

type = "String"

value = "<%=carrier%>"

size = "3"

design = "standard" />

<ui:button id = "myButton"

text = "Find Flights"

onClick = "FIND"

design = "STANDARD" />

<ui:tableView id = "myTable"

table = "<%=flights%>"

headerVisible = "true"

footerVisible = "true"

fillUpEmptyRows= "true"

selectionMode = "MULTISELECT"

design = "ALTERNATING" />

_{</ui:form>

</ui:page>

_{</ui:content>}}

Note on the prefix:

The BSP extension HTMLB is imported into the BSP page through the extension directive (2^nd line). A prefix serves as a unique identification of this extension within the page. This directive is automatically crated after you have inserted the first BSP element for the page. In the standard version, the default prefix is taken. However, you can rename the prefix by overwriting the corresponding value in the extension directive (in our example: ui).