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

 

Single-Row View Pages

The responsibility of the contactlist page that we designed in the previous section was showing a list of the rows returned from execution of a query.  However view pages are also able to show the details of a single row.  In this case, instead of showing a table of rows, only the attributes of a single row are displayed.  The syntax used for describing this kind of view pages is quite similar to the multi-row view pages, with the single difference that instead of the <body> tag a <top> tag encompasses the data definition section of the page.  As an example, we design the contactdetail page.  To allow for comparison, we omit the email address in this stage.

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

<page type="view">
  <title>Contact Detail</title>
  <icon>contactdetail.gif</icon>
  <top>
    <querysource>xmlquery/contact.xml</querysource>
    <pageparam>id</pageparam>
    <fields>
      <field name="name" caption="First Name"/>
      <field name="lastname" caption="Last Name"/>
      <field name="phone" caption="Phone#"/>
      <hr/>
      <field name="address" caption="Address"/>
    </fields>
  </top>
</page>

It is seen that the XML definition is quite similar to the definition of the contactlist page.  Presence of the <top> tag denotes that this page is displaying a single row.  Therefore, the source query of this page must also return a single row.  However the source query of the page is the same as the query used in the contactlist page.  Actually, extracting the single required row is accomplished by the <pageparam> tag.

The "Detail" link provided in the contactlist page passes the value of the id attribute for the selected contact to this page.  On the other hand, in this page the <pageparam> tag introduces the id attribute as the page parameter.  So when the page is executed, the row for which the id attribute is equal to the received parameter will be selected as the source row.  In fact, the attribute defined in the <pageparam> tag and the value of the parameter construct a conditional expression which is added to the where clause of the query, before it is submitted to the database.  The output of this page is shown in the following figure.


Contact detail page in browser

It is seen that just changing the <body> tag with the <top> tag has resulted in a complete reorder in the page layout.  Instead of displaying the value of the attributes in columns, the page lists every attribute in a separate row and the captions are printed as titles before the values.

In the next section, we will change the contactdetail page so that it includes the email addresses associated with the contact.  This is accomplished by using the hybrid view pages.