What XPage Is
How It Works
A Case Study
View Pages
      Multi-Row
      Single-Row
      Hybrid
Insert Pages
      Hybrid
      Single-Row
Edit Pages
Search Pages
Delete Pages
      Single-Row
      Hybrid
Overall Features
      Page Features
Engineer's View
      System Catalog
      Page Types
      View Pages
      Insert Pages
      Edit Pages
      Search Pages
      Delete Pages

SourceForge Logo

 

View Pages

The view page are used to retrieve information from the application's data source and display it to the end user.  The data source of a view page is specified by one or two database queries, which are stored external to the XML document describing the page itself to allow for re-use of the queries across the pages.  View pages can be used to display a list of the rows returned from a query (multi-row view page) or to display the details on a specific row (single-row view page).  It is also possible to combine both features on the same page, thus allowing for simultaneous presentation of information from two independent data sources on a single page.  This is mostly useful for displaying related data from the two sides of one-to-many relationships.

In addition to specifying the query for retrieving the intended row(s) from the database, the developer should specify how the attributes of the retrieved row(s) are displayed in the constructed page.  Normally the attributes are directly displayed on the page; however it is also possible to perform computations on the attributes and display the result.

Multi-Row or Tabular View Pages

The following figure shows the XML definition for the contactlist page.

<?xml version="1.0" encoding="UTF-8"?>

<page type="view">
  <title>Address Book</title>
  <icon>contactlist.gif</icon>
  <body>
    <querysource>xmlquery/contact.xml</querysource>
    <searchquerysource>xmlquery/contactsearch.xml</searchquerysource>
    <defaultorder>lastname ASC</defaultorder>
    <fields>
      <field name="name" caption="First Name"/>
      <field name="lastname" caption="Last Name"/>
      <field name="phone" caption="Phone#"/>
      <cfield name="address" caption="Address" code="addrhead"/>
      <link name="linkdetail" on="id" target="contactdetail" caption="Detail" text="Detail..."/>
      <link name="linkedit" on="id" target="contactedit" caption="Edit" text="Edit..."/>
      <link name="linkdelete" on="id" target="contactdelete" caption="Delete" text="Delete..."/>
    </fields>
  </body>

  <code name="addrhead" language="php">
    <![CDATA[
    $text = substr($source, 0, 30);
    if ($text) {
      $text .= "...";
    }
    return $text;
    ]]>
  </code>
</page>

Every page opens with the <page> tag.  The type of the page is denoted in the type attribute.  The <body> tag denotes the beginning of a list of rows.  Within the <body> tag, the <querysource> tag specifies the query for retrieving rows and the <defaultorder> tag specifies the initial order used in displaying the rows to the user.  The <fields> tag encompasses definition of the columns displayed on the page.  The source of each column is one of the attributes available in the result set returned from the execution of the query.  Three tags are allowed inside the <fields> tag:

  • <field> tag is used for directly displaying the value of an attribute

  • <cfield> tag is used for displaying the result of applying some computation on the value of the attribute

  • <link> tag is used for displaying a hyperlink to some other page and sending the value of the attribute as the parameter

The following figure displays the contactlist page in a browser.


Contact list page in browser

For the <field> tags, the name attribute specifies which attribute from the result set should be displayed.  The title appearing in the head of the column is provided by the caption attribute.

For the <cfield> tags, the name attribute is used to determine the source attribute for the column.  The code attribute specifies the name of a function whose definition is provided at the end of the document.  For computed fields the value of the attribute is passed to the specified function and then the value that the function returns is shown in the appropriate cell.  The function body is written in a programming language supported by the environment in which the tool runs (currently only PHP is supported).  Computed fields are one of the mechanisms that can be employed for extending the basic functionality of the tool.  In this example, since the address attribute is of text type and can contain large amounts of text, we have used a computed field to only print its first 30 characters.

The last three columns in the constructed page are three links to other pages of the address book application.  Every link sends the value of one attribute to its target page.  The links are specified by the <link> tag and they should include the following attributes:

  • "name" is a unique identifier for the link

  • "target" determines the target page

  • "on" denotes the name of the attribute whose value is passed to the target page

  • "caption" is printed in the caption of the column

  • "text" is the text that is repeated in every cell.  If this attribute is omitted, then caption is used instead.

In this example, the first link passes the value of the "id" attribute to the contactdetail page, whose responsibility is displaying the complete information for a single contact.  When the user clicks on this link for one of the rows, the value of the "id" attribute for the associated row is sent to the contactdetail page.  Upon receiving this value, the contactdetail page would be able to extract the necessary information for the intended contact and display it to the user.

As it is shown in the browser, the rows are paginated in numbered pages so that the user can easily browse the rows.  It is also possible to sort the rows based on any of the shown attributes in ascending or descending orders.  These features are automatically included in the generated pages and they do not need to be defined explicitly.