Learning XPages Part 19 : Another Repeat Another Table

So now that we have our second XPage created
lets add some content to it. We’ll start by opening the new custom control
that we created called content_Location and clear out the placeholder text.
Once that’s done we need to define the data source for the control. Select
the ‘Custom Control’ node in the outline view on the left of your screen
and go to the ‘Data’ properties tab. Create a new data source based on
the vw_People view that is in the sample database

Now, just like the home page we will
drag in a repeat control and into the repeat control we will create a table
of two rows and six columns by dragging in a table control. Give the first
row of your table some headers and then select the repeat control to look
at it’s properties.

Set the Collection Name and Index Name
just like before and then, just like the repeated table on the homepage
we need to drag in some computed field controls and set their values by
using JavaScript similar to rowData.getColumnValue("colname");
where colname is the name of the column in the view that we are using as
our data source. Next you move the repeat control inside the table and
change the table header row to <th> tags. I have also given my table
a styleClass of ‘phonebook’ so that it uses the same CSS as I created for
the homepage’s table.

You can now save your custom control
and preview the ‘Location’ XPage and you will see a nice table listing
all the people in the database. Feel free to apply the alternating row
styles to the table just like we did for the homepage to give your application
a consistent look and feel.

In the screenshot above you’ll notic
that the alternating row styles don’t seem to have worked however if you
examine the original view that the database is based on you’ll see that
it has a categorized column at the start of the view and the two red lines
I have drawn above are rows in the table where those empty categories are
showing. In the next part I’ll show you how to pass a variable on the URl
to restrict the repeat to a single category.