« XPages in Pictures - 01 - Introduction | Main| XPages in Pictures - 03 - First XPage »

XPages in Pictures - 02 - Forms and Views

Category XPages
Here we go….

I want to make a simple working application using XPages. This will be a small customer tracking application. Nothing fancy. We want to store Companies and Contacts.  Maybe we’ll add additional features later.

I’ll start out by storing companies as main documents and then have contacts as response documents.  Not unlike a typical Notes Application.  I’ll have a primary starting page with a list of companies on it and a button to create a new company.  The Company screen will have a view of all their contacts, just like an embedded view (show single category) in a Notes App.  There might be other ways to present some of this data, but for the time being I’m going to stick with the look and feel of a Notes Client type application.  I want to get some basics down before we start going “outside the box”.

Create a new application called xDemo.nsf.

The first thing to do is to create a Form to hold the company field information.  

XPages seems to replace the need for many of the common Notes Design Elements that we typically use.  Pages, Navigators, Outlines, and Sub-Forms, are not really needed in XPage Development.  But you still need Forms and Views.

Forms are going to be used to define your data.  We’ll use fields like in traditional Forms, but that’s all you’re need on the Form. You won’t need any tables, description or formatting if the application is only going to be viewed from Xpages and not the Notes Rich Client.  The Form will now just define your data.  There will be very little business logic needed in the Form.

Create a new form called “fCompany”.  Create the fields that you see on the screenshot.
A picture named M2

Note:  I’ve already mentioned that the language of choice for XPages is JavaScript.  If you know nothing about JavaScript, and I’m assuming you might now, be aware that JavaScript is CASE SENSISTIVE.  Case matters everywhere.  Even in fieldnames.  So you may want to think about how you create your fieldnames.  You may want to use all lowercase or Camel Case.  


For the field “unique”, make it computed for composed with the formula @unique as the value. I’ll talk more about this later.

A picture named M3

Save the form when you’re done. You now have a Company Form.

Next, create a form to hold the contact information.  Again, this just needs a few fields for our exercise.  This should be set as a “Response” document.  Call the form “fContact”.

A picture named M4

This is very simple so far, just two little forms that you use to define your data structure. You might be used to putting the fields in a table with descriptive labels and other formatting, but since we’re only going to focus on seeing this data through xPages, it’s not necessary to have anything other than the fields on the Form.  If you wanted to use this application in the Notes Client as well, you would just create nicer looking forms.

You’ll need 2 views for the application.  The first view, for companies, should have all the fields from the Form.  The company name should be in the first column and we’ll want to sort that ascending.  The selection formula for the view should be:

SELECT form = "fCompany"

A picture named M5

Call this view “vCompanies” and save it.

The second view will be for contacts.  We’re dealing with response documents here.  So add all the contact fields to the view but the first column will be computed to show the $REF field.  The formula should be:

@text($REF)

Now this column should be categorized which will automatically sort it as well.  Finally we’ll want to go into the view properties and turn off “Show responses in hierarchy.”

A picture named M6

Call this view “vContacts”

For now, that’s going to be it for “Traditional Notes Development”.  You have 2 forms and 2 views.  In the next post you’ll create your first XPage. You’ll learn how to “Bind” data to a Notes Document, add fields to the page and create and manipulate a table.

Post A Comment

:-D:-o:-p:-x:-(:-):-\:angry::cool::cry::emb::grin::huh::laugh::lips::rolleyes:;-)

Powered By:

Domino BlogSphere
Version 3.0.2