Learning XPages Part 15 : Building The Homepage Content

Time to display some real content on the
homepage of our application. For the homepage I’d like to list all the
locations along with their main phone number and main fax numbers. Lets
start by opening the content_HomePage custom control that we created when
we were building the layout for the site.

Again we are going to be using a repeat
control so the first thing we need to do is define the data source for
the repeat control. Using the Outline View on the lft of your screen select
the ‘Custom Control’ node in the outline tree and then switch to the Data
Properties section on the properties tab. This time I’m going to use the
ContentLocations view in my database.

A picture named M2

I have given the data source a name
of dominoLocationsView. I could have used dominoView again just like in
the sidebar list of locations and it would have been fine, the XPages server
runtime has no problem with different components having data sources with
the same names, it keeps a handle on what source belongs to what component
however my own preference is to always give things more descriptive names
so that you can quickly work out what they were for when you come back
to an applications design after a long period of time.

Now that we have the datasource defined
we can display it on the XPage. I’m about to introduce you to a new control,
the ‘View’ control but then I am going to remove it and show you my preferred
way by using a repeat control. Lets start by dragging a View control into
the XPage. Make sure it appears between the divs with the ‘lotusContent’
class so that it will appear correctly on your XPage. When you drag in
the control you’ll see a dialog box prompting you for some basic information
for the view’s data source.

A picture named M3

We have already defined our data source
so we can just select it from the dropdown at the top of the box, you can,
however, create other datasources directly from this dialog if you want.
We are just going to select these defaults for our data source and then
click OK at which point you’ll see an automatically generated table appear
in your xPage.

A picture named M4

and if you save and refresh your XPage
you’ll see some real data appearing in your application.

A picture named M5

Of course because we have not put any
styles on the view control yet it looks terrible but it does demonstrate
how quickly we could get data from a view in our notes application to appear
on screen in an XPage.

In the next part I’m going to delete
this view control and build it manually using a repeat control and my own
CSS stylings.

Tagged with: , , , ,
Posted in None
%d bloggers like this: