Category
XPages
Just a reminder in case anyone's interested.
This Thursday at 12:00 NOON EST I'll be giving an introduction session
on XPages for Lotus Education
Online. This session will repeat on Wednesday the 21st
at 8:00 AM EST. This time is different then what I said in the screencast!
I had mentioned 8 PM EST. It's actually at 8 AM EST.
There was a small mixup there.
I've got a couple more Notes In Nine
shows lined up for once I get past the webinars and hopefully I'll be back
on iTunes really soon.
Thanks!
Category
XPages
I've published the 7th episode
of Notes In Nine. In this show I talk about XPages built
in capability to easily add a Type Ahead to your field. I demo how
to deal with the 64k Limit and also the potential pitfalls of Full vs.
Partial Mode.
As I mentioned in the show, a big thanks
to Mark Hughes who posted a great blog article
here and also Paul Hannan and Maire Kehoe who are XPage XPerts from IBM!!
Notes In Nine - 007
Also a big shoutout to my buddy Chris
Toohey who actually beat me in blogging about this!
Last night when I finished the show I uploaded it to YouTube and
hit the sack. Chris Toohey doesn't sleep, he just goes into power
saving mode.
UPDATE:
This was meant to go out Thursday -
but I broke my feed. Whoops!
Category
XPages
I've teamed up with Lotus Education
Online to create a new Webinar on XPages. I call it:
XPages:
Notes Development meets Web 2.0.
If you haven't seen XPages, or you are
working in XPages but have yet to establish a comfort zone, then this webinar
is geared for you!
I'm going to cover the What, Why's and
Hows of XPages that you need to know to get started.
The session is currently scheduled twice:
Thursday October 15th at 12:00 Noon
EST.
Wednesday October 21st at 7:00 pm EST.
I'm approaching this like a live version
of my screencast, "Notes In Nine".
So if you like that, then hopefully you'll like the webinar.
Category
XPages
Below is the demo file that I used in the
last episode
of Notes In Nine.
I received a couple of questions so
hopefully the file will help. I intentionally tried to focus a little
more on the "What can you do?" and "Why would you want to?"
rather then "How do I make this work?" I couldn't really
do both the "Why" and the "How" in a single show. It
is only Nine minutes after all. :)
Anyway, getting started with Blueprint
isn't that difficult once you have it setup and hopefully the demo file
will help with that. If there's interest I can always do a followup
show that goes through creating the navigation from scratch.
Thanks for the all the interest!
Category
Notes In Nine XPages
I've published the 6th episode of Notes
In Nine. After not talking about XPages at all in the last show I
just had to dig back in. In this show I talk about using XPages with
a CSS Framework.
My intention is to give a little over
view of how to get started using Blueprint in XPages.
Why does it matter? If you're
a Notes Client person getting started in XPages/Web stuff, you're going
to need to learn CSS on top of other things. Blueprint allows you
to place items on your page easily. I really like it. If you
want to see a good example of Blueprint in action check out IQJam.net.
The link to the show is:
Notes In Nine - 006
P.S. One day I'll find time to get back
on iTunes.
P.P.S Yes I need music for the Domino
video part. I'm working on that as well. ;)
Category
XPages
In this edition of Notes in Nine I talk
a little more about Scoped Variables. In addition to that I give
an example that is the XPage equivalent of a very common UI component for
a Notes Client Developer:
A form with an Embedded View on it
that uses Show single Category.
A little while back I was publishing
my own little series of Blog Posts inspired by Declan's great Learning XPages
series. While I got away from that for a while I just posted the ninth
article in that series. The demo in this episode is really
a video walk through of this ninth article.
This episode is slightly longer then
the last couple of shows. I actually broke my 10 minute limit a couple
of times and had to "re-shoot". I think I ended up going
and talking a little too fast in this one to squeeze everything in and
it comes off a little rushed. I gave some thought to scapping it
and starting all over, but I'm not sure when I'll have time to do another.
Due to traveling next week it'll probably be 2 weeks or so until
the next show. In the end I decided to post what I had because I
really wanted to post a contribution today.
Speaking of traveling, next week I'll
be at IamLUG then I'm off to Wildwood NJ. I'm really looking forward
to getting away from the day job for a week.
The link to the YouTube video is here. Please note that YouTube likely
won't have the High defination processing done until 9:00AM EST.
Thanks so much for all the interest
and feedback!
Category
Xpages
This is a long story for a relatively short
answer. Sorry about that...
Recently I was working on a test XPage
application and wanted to have a page that would let the users fill out
some fields and then it would create a document in the "backend"
using server side Javascript and send the document to a team HelpDesk e-mail
account. I would not be saving this document in the application.
On this page I wanted to have a simple
Radio button with the choices Low, Medium, and High. The user would
choose the level of their problem and I'd include that in the e-mail. However,
I hadn't used Radio Buttons up to that point. Especially in the case
that I wasn't really saving the XPage. I only wanted to get the value
to the backend document that would be mailed.
I had some problems trying to figure
out how to get the value. You see, when you're dealing with individual
radio buttons on an XPage, each option is it's own component and when you
drop them on a page each has it's own unique name. This is not like the
Notes Client where you have one Field of the type "Radio" with
multiple options inside it. Hmmm.. I know in traditional Javascript
you need to iterate through a control looking for the checked property.
But what do you do here?
I first tried to get the value of the
selected button by trying to do a getComponent on the group name.
var choice = getComponent("groupName")
Well that didn't get me to far. So
I shouted out on twitter and got some good suggestions. The best
might have been to ask Matt
"Mr. XPages" White himself,
but really this has to be solvable by us mere mortals. Paul Hannan noticed
that I didn't have "getValue" at the end of my statement. Whoops.
I do keep forgetting that so I gave this a try:
var choice - getComponent("groupName").getValue()
Still no Joy. Declan suggesting
I look at the Domino Designer Wiki which I did go back to. There's
some articles on Radio Buttons but they seem to be talking about a Control
in the Other Controls section called a Radio Group. I still don't
know what that is. Something to do with not having hard coded values
but looking them up from a view I think. That didn't seem right so
I moved on.
Back to playing with my XPage I noticed
that even though I didn't really want this page bound to a Notes Form,
it was telling me to. These radio buttons wanted to be bound to something.
Ok who am I to argue with DDE? So I created a form and bound the
3 radio buttons in the group to the same field.
That's when something really interesting
happened! I tried this code:
var choice1 = getComponent("radio1").getValue();
var choice2 = getComponent("radio2").getValue();
var choice3 = getComponent("radio3").getValue();
And guess what? Each variable
contained the SAME value. So to get the Value of a radio button in
XPages, just get the value of ANY of the controls in a Radio Group!
How cool is that? No looping to
find a value like in normal JavaScript.
XPages are like wives. They can
be frustrating at times, but at the end of the day, you're glad to be with
them.
Category
XPages
This is the 8th Post in
the “XPages in Pictures” series.
Ok. Now it’s time to tell
the xContact page to return to the parent company when you save a contact.
Open up the xContact Page. Click
on the save button and remove the Simple Action “Save Data Sources”.
This action allows us to save all the datasources that are bound
to the page and gives us a parameter on which page to open next. We’re
going to instead use 2 simple actions. The first to simple save the
data and another one to open our return page.
Add a new action that uses the
category of “Document”. The Action is “Save Document”.
This is a simple save action. There
is no return page built in. Click ok to add this to your list of
Actions. It will be indented under “Simple Actions Root”.
Now add another simple action.
Go back to the “Basic” category and choose “Open Page” for the
Action. The name of the page is “xCompany”. The Target document
is “Edit Document” and the document ID is where you’re going to reference
your sessionScoped variable.
The Document ID box is expecting
a specific document id. You can’t type your code directly in the
box. You need to compute the ID. Click on the diamond next
to the Document ID box and choose “Compute Value”
When in the script edit enter the
following code:
sessionScope.get("companyCode")
Click Ok. The Action box
should look like this:
Click ok to add the Action, and
you now have an Actions Group.
This is the equivalent to having
a “Save and Close” action in the Notes client. The document will
be saved, and the browser will open the xCompany page, in Edit mode, finding
the company document that matched the UNID variable that’s stored in the
scoped variable.
Save your page. Go into a
company, create a contact and save it. You should now be returning
to the correct company after the save!
Category
XPages
This is the 7th post of
the “XPages in Pictures” Series.
Now it’s time to address the fact
that saving the contacts returns us to “xMain” instead of the company
page that we were on when we created it.
In the last article, you saw that
when you created a response document, you passed the current companies
noteid field into the simple action as the Parent ID. If you could
only store the noteid somewhere, you could then use it in the Save button
of the contact page to return us to the correct company. But how
do you store a variable that spans different XPages?
Scoped Variables
It turns out there’s a way to
store this information in something called “Scoped Variables”. There
are different types of scoped Variables. I’m going to talk about
2 that are of interest right now.
1- viewScope
The variable lives for
the duration of the page
2- sessionScope
The variable lives for the duration of the user session.
Since you want to access a variable
between pages lets focus on sessionScope. You’ll create a variable
that can be accessed from anywhere. Here’s how:
Open the page “xCompany”. Go
to the Events tab of the XPage and click on “afterPageLoad”.
This event will run after the page
loads and will let you get the documents’ “universal id” from the backend
document object and store that in a sessionScope variable. Once that
happens it will be available from any page.
Rather then using a Simple Action,
like you’ve done before, now you’re going to have to enter JavaScript
that will run on the server. Select “Script Editor in the radio
button. Now you can start to enter JavaScript in the box, or click
on the “Open Script Editor” button, to bring up the editor.
Enter the following code:
//Get the document object in JavaScript
var doc:NotesDocument = companyDoc.getDocument();
//Create a variable with the Universal ID
var sID = doc.getUniversalID();
// Assign the variable sID to a Session Scope Variable
called "companyCode"
sessionScope.put("companyCode",sID);
Your screen should look like this:
Now that you’re starting to enter
JavaScript code, I should mention debugging. At the time of this
writing, Notes DDE version 8.5, debugging tools and techniques seems to
be lacking. My suggestion is to save often and test in the web browser
often. (This is another way of saying that I haven’t figured out
a great debugging approach yet.)
Testing…
You now have a variable that will
be available for any XPage. Before putting this to a practical use,
make sure you’re getting a good value. You can test this by using
an Edit Box Control that’s bound not to a field on a Notes Document, but
to the sessionScoped Variable itself.
From your Core Controls List, drag
a Label to the page. Then drag and Edit Box next to it.
The resulting page should look
like this:
Now click on the Label control
and change the “Label” property to be “UNID:” Then click on the
Edit box control and go to the Data tab. This is where you control
the binding.
In the beginning when you created
the xCompany and xContact Page, you dragged data fields to the XPage and
a nice table of field names and controls was created and the binding was
automatically done for you. Here is where you can control the binding
of individual fields. Maybe you don’t want a table, or you want
to replace an Edit Box Control with a Multiline Edit Box. You can
choose between Simple, Javascript, and Advanced data binding.
In this instance, you want to bind
to the scoped variable “companyCode”. This variable is created
and updated with the page xCompany loads. To do this, you want to bind
data using the “Advanced” option. Choose “Scoped Variable” next
to “Use:” and select “Session Scope” and enter the variable name “companyCode”.
Note: This screen shot looks incorrect
as I review this post. The variable name should be "companyCode".
XPages is very case sensitive so be careful. I'll try and update
the screenshot soon.
Finally, go back to the Edit box
properties and bake the control “Read Only”. Save the page and
launch the application in your browser. Click on any company. You
should now see the companies’ UNID..
000000000000000000000000000000000000000000000000
Click on different companies. Notice
how the UNID on the page will change. This variable is getting updated
every time you open a company!
Pretty Cool huh?
Category
XPages
This is the sixth article in the XPages
in Pictures series.
At this point you have a small
XPages application that allows you to track Company names and addresses.
This app starts in a page that lets you view any companies that have
already been created. There’s a “New Company” button to create
additional companies. Inside the list of companies, you can click
on the name of the company to open it up and edit it. Saving any
changes brings you back to the Main page.
On a technical side, you’ve seen
how to create an XPage and bind it to a form. You’ve seen how to
add fields to the page and you’ve created a button that saved the data
source and returned the user to a specific page. You’ve gone deep
into the properties of the XPage and found and turned in “computeWithForm”.
Not too shabby really. Especially
for so little coding so far. Once you go through this process the first
time, the next time through should be much quicker.
Adding Contacts
Ok. Now’s the time to start
integrating contacts into our application. The goal is to allow the user
to enter as many contacts as they want for a particular company. They will
open any company and see a “New Contact” button. They will also see a
list of existing contacts on the company screen.
Let’s get started.
Create a new XPage and call it
“xContact”.
Bind the page to the form “fContact”.
Name the Domino Document “contactDoc”.
Now, just like you did for the
company document, add all the fields from the Data panel to the page. Like,
before, select them all and just drop them on the page. Rearrange
the table order until it looks like this:
Now add a button to the page and
change the label to be “Save”. Go to the onclick Mouse event and
click on “Add Action”. Choose “Save Data Sources” and have the
next page be xMain.
Note: Normally you would
would not want to return to the xMain page on saving a contact. You’d
prefer to return to the company that you were in. We’ll address
this in a just a little bit.
Save your xContact page and open
up the xCompany Page.
Drag a new button to the page.
Call this “New Contact”. Like before, go to the onclick event
and Add a Simple Action.
This time, you’re not going to
use the “Basic” category. Click on the dropdown for Category and
change it to “Document.” Change the Action to be “Create Response
Document”. The name of the page to open is “xContact”.
The screen should look like this.
Notice that there’s a warning
message. The Parent ID is required when creating response documents.
To give it a parent ID we’re going
to use a little bit of JavaScript. Click on the diamond at the right
of the Parent ID and choose “Compute value” to bring up the Script Editor.
The script editor should look like
this:
The language we’re going to be
using is JavaScript. Specifically Server Side Javascript; this gives
you a lot of shortcuts.
If you think back to when we created
an XPage and bound a document to it, the default name is usually “document1”
and in the case of the “xCompany” page we changed that to “companyDoc”.
Here is where you start to see this change getting used. Look carefully
on the left hand side and you will see “companyDoc”. Expand “companyDoc”
and take a look at the methods.
These methods are very similar
to the backend objects that are used in LotusScript programming!
Double click on “getNoteID()”
to add this to the script window.
That’s all you need. This
will tell XPages to make this contact document a response document of the
current company. The Parent ID is now computed. Your simple
action screen looks like this:
Click ok to close the window and
then make sure to save the XPage. Go ahead and create some contacts
for different companies. Ignore the fact that on the save, we’re
going back to the main page instead of the company page. That will
get address shortly.
After creating some contacts you
should then just verify that they are being created as response documents.
In the Notes Client, open the view “vContacts” to check.
You’ve now seen how to create
documents that are responses to the current document. We’ll be going
deeper into this in the next few articles, working up to the equivalent
of a show single category embedded view.
Category
XPages
This is the Fifth article in the XPages
in Pictures Series.
In the last article, we created
a home page called “xMain” to be the initial page of the application.
It has a “New Company” button on it, but nothing else. Today
you’re going to add a view of all our saved companies to this page. You’ll
also create links to the companies in the view so they can be edited. Finally,
you’ll see how to associate a Notes Form with an XPage.
Adding a “Companies View”
to the xMain page.
Ok, you’ve created some company
documents but now you want to display them. You’re going to use a “View
Control” to display the view directly on the “xMain” page. Open
up the “xMain” page and locate the View Control that lives in the Container
Controls section.
Now Drag this onto your page. You’ll
be presented with a popup box.
Set the view to “vCompanies”
and click OK. Don’t worry about anything else right now.
Now save and preview xMain in your
browser and you have a nice list of any companies you’ve created.
Notice how there is already a Pager
in the top right corner of the view? No programming needed!! In
Designer, you can click on the pager control and change the style if needed.
You can even create a custom style.
Adding Links to the View.
Now we want to create links so
we can return to the company. We’ll put them in the first view column.
Click in the name column of the view. Click in the column itself,
not the header.
Then in the properties of that
column click on “Show values in this column as links”.
Now if you were to save this and
preview xMain, you’ll see that your view has links for the company names
and none of them work.
What we need to do is tell XPages
how to open the link. There are two ways to do this. The first
is in the view control itself. If you select the view control, by
clicking one of the sides in the overall “Box”…
You’ll be able to get to a property
of the view control that let’s you set what XPage to use when opening
the document.
If you were to select “xCompany”
here, your links would now work correctly but you’d have to remember to
do this in the future if you used additional view controls. So for
now, leave this set to “The document’s default form or page.”
Go into the properties of the traditional
Notes Form. On the second, beanie tab, there’s a new option for
displaying an XPage on Web Access.
Choose xCompany and save the form.
Now go back to your browser and
look at xMain again. Clicking on the linked company name brings up
the company document in an XPage. You can make changes to everything
except the computed when composed “Unique” field. Clicking the
save button brings you back to the main page.
In this article we’ve added a
View Control to the page and bound it to data. We’ve taken a column
of that view and turned it into links that open the correct company. Our
application now allows use to create, view, save and edit company documents.
We even have a pager to assist in navigating the contacts view.
Not a bad start for doing no real
coding whatsoever yet.
Category
XPages
This is my 4th posting
in the “XPages in Pictures” series. This one is a little on the
long side. In this episode we’re going to create a Home page for
the application, add a button to create and save a new company, and even
go off on a small tangent to discuss creating a unique number.
Creating a Home Page
First, we want to make a new XPage
that will act as a main or “home page”. This new page will hold
a button that will allow us to create new companies as well as how a view
that will display a list of any companies that we’ve created.
Create a new XPage called “xMain”.
Unlike what you did with the company
page, you’re NOT going to bind the page to any data. There won’t
be any direct fields on this page, at least for now. All this page
will have is a “New Company” button and a View Container Control. The
View Container Control will get bound to view data in order to show the
list of Companies.
First, drag a button from the Core
Controls section to the page. Under the Button Properties, change the label
to be “New Company”.
Now, go to the Events tab for the
button. There are all sorts of Events available. For each event
we have the option of adding JavaScript Code or selecting one of the many
Simple Actions. Don’t discount the Simple Actions! Since
the properties of Simple Actions can be computed these actions can be very
handy.
To create a New Company, you want
to add a “Simple Action” that will allow you to create a new company
document. Technically it will open the XPage “xCompany” as a New
Document. Click “Add Action”. Change the “name of the page to open”
to be “xCompany” and the Target document to be “New Document.”
Test this in your browser. You
should now have a method of creating new companies. Good work!!!
You might notice that the field
“unique” has no value. Ideally we’d like a unique key in this
field. Also, you probably want a way to SAVE the company document.
Lets look at those two issues now.
Close the xMain page and go back
to the xCompany Page. First let’s create a button to save a new
company document.
Saving the Company Document
Drag a button onto your page. I’ve
placed mine underneath the table. Change the label for the button
to be “Save”. Go to the Events tab. Add a simple action.
The Category should be Basic and the Action should be Save Data Sources.
For the name of the page to open next, select “xMain”.
Now you can create a company, save
it, and send the user back to the main page. Now we’re starting
to cook with Gas as they say!
Unique Numbers
But what about the Unique field?
In the original Notes form, we set it to “computed when composed” with
the formula @unique. This implies that we want to have a unique,
unchanging number for future functionality. Typically the result
looks something like this: DLEY-7R4HNY
I’ve found 2 ways to get a unique
value in Xpages. The first is to use the built-in Javascript translation
of @unique. The syntax is @Unique(). To do this, click on the
edit box control for “unique”. Then in the Data Properties, click
the little diamond next to Default Value.
Select Compute Value to get to
the script editor. Enter your formula into the code window. You
can also use the Dropdown under libraries to switch to @Functions to see
other @Functions that are available. We’ll be using some of these later.
Now if you save this page and preview
it in your web browser you’re going to get a unique value. I think!
What is this value? I have
NO idea. I’m not sure why it’s not using the format of the traditional
@Unique. I’m not even sure if it can be considered “Unique”.
Ok, so we either don’t like this
format or don’t trust it yet. Let’s populate this field with the
normal looking @Unique value.
First, remove the formula for the
default value of the unique field. We won’t be using it after all.
Since we have the formula we want
on the Traditional Notes Form. We can use it by telling the XPage
to “computeWithForm”.
First click somewhere on the XPage
itself. We do not want the focus to be on a control or label.
Then go to the Properties and All Properties section. You’re looking
for data. Underneath data is another data, and then you should see
a dominoDocument. dominoDocument contains a computeWithForm property.
Click next to it and choose “onload”.
This will compute the fields of
the XPage against the computed formulas that are embedded in the form.
This is a method of keeping some business logic in the form itself
if you’d like.
Save your form and try creating
a company.
You should see the normal format
for @unique.
But this field is editble. Not
what you would want for this kind of field.
Click on the field “unique” and
find the properties for Edit Box. Put a check next to Read-Only to
prevent this from being edited.
Well done! We’re finished
working with the Company XPage for the time being.
I don’t really know if we’re
going to need this unique number in the future, but I wanted to have it
for the demonstration.
Auto Launching an XPage
Let’s flesh out the application
a little more. We want to set the xMain page to Auto Launch when
a user opens up the database on the web.
Click on “Application Properties”
in your database. Remember these are double clicks!
The second tab is called “Launch”.
In the section for Web Browser Launch, set it to “Open Designated
Launch Page” and set the XPage to be “xMain”. Make sure you save the
changes.
Congratulations. You now
have the start of a little application that’s all XPages. Opening
this database in a browser should give you a page with a new company button.
Clicking this button allows you to create a company document. A
uneditable unique number will be automatically assigned and you can fill
in the name and address fields and save the company. By clicking
Save you are returned to the main page. In the next article we’ll
create a view on the Main page to display the companies.
Category
XPages
This is the third post in my series...
The first XPage we’re going to
create will be used to display the Company documents.
Create a new XPage and call it
“xCompany”.
We want to bind this page to our
company form. This is a new concept. In Traditional Notes Development
the Form could only ever contain a single document. You can reach
into other documents with embedded views, dialog boxes or script but the
rule is one document to a Form. In XPages it’s possible to have
multiple documents on a single XPage. So we now have to deal with
“Binding” which is telling an XPage or even individual “control” what
document to work with.
For now we’re going to keep it
simple and “Bind” 1 document to 1 XPage.
At the bottom, go to the Data section
and click on Add:
The default name will probably
be “document1”. Let’s change it to be “companyDoc”. Choose
“fCompany” for the form, and the default action can be “Create Document”.
You now have an XPage that’s bound
to the company form. On the right hand side, there should be a Data
Tab next to the controls tab. This will show you the fields from
the company form.
Now, we need to select all the
fields. Click on the first item, “address1” then click on “zip”
while holding down the shift key. All the fields should be highlighted
in blue. Just drag them to the page. It will put all the fields,
with labels inside a table.
How cool is that? Try doing that
in a Notes Form! There’s even a cool Wizard that can help here. I’ll
talk about that later.
For now, we want to change 2 things,
the order of the fields, and the text of 2 labels. Let’s do the
labels first.
The labels are coming from the
actual field names. DDE is automatically capitalized the first letter for
you to try and help. How thoughtful! In the Form, there is
only a single Address field, but I called it address1 in case we wanted
another address field in the future. You will want to change the
label to just “Address:”. Do this by clicking directly on the word
“Address1”. You should see the properties change at the bottom
of DDE. Change the label in the circled area to remove the “1”.
Do the same thing with the label
“Companyname”. Rename that to be “Company”.
Your table should now look like
this:
Now you want to re-order these
rows. There are several ways this can be done. You could do
this in the Source view, or even with the outline panel. I’m going
to keep it simple here and work with the table like we might on a traditional
Notes Form.
Click in the first row of the table
to place your cursor. Then click “Table – Add Row Above”. This
is available from the menus at the top, or the context menu that you get
when you right click.
You should now have this:
Carefully click on the label “Company:”
and drag it to the top cell. Do the same with the companyname edit
box.
You get this:
Now continue to re-arrange the
order until it makes sense to you. Move State up a row, Zip to where
state was, and then you can delete the empty row where Zip used to be by
using the option “Table – Delete Row”.
You now have a table that looks
like this:
Dragging controls from cell to
cell in a table isn’t too difficult. But you do need to be careful,
as I’ve seen DDE get a little temperamental. Arguably using the
Outline view or the Source view might be a better way to do this but I’m
trying to keep things simple and familiar.
Now would be a great time to mention
something else Domino Designer in Eclipse (DDE) gives us. Multiple
levels of Undo!!! So if you are dragging fields around and miss
a placement, Edit-Undo (CTRL-Z) is your friend. I don’t know how
many levels it stores, but it’s a lot. And guess what? It’s
not just for XPages! Multiple Undo works in Forms and other design
elements as well!
Ok, now it’s time to save the
xCompany XPage and move on. Don’t worry, we'll come back to this
soon.
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.
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.
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”.
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"
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.”
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.
Category
XPages
To me, trying to learn XPages is like
eating Hot Peppers. It’s fun and exciting, but there’s serious
pain involved.
Right now my pain is in learning
how to do “simple” things in XPages.
What I intend to do is to start
sharing the few things that I’ve learned so far. Hopefully this
helps someone else starting to look into XPages. This will probably
be more on the basic end compared to some of the other examples out there.
It’ll probably be geared for Notes Rich Client developers since
that’s primarily what I do.
There are several hurdles in learning
XPages; there’s the initial hurdle of learning how to move around in the
new Domino Developer for Eclipse (DDE). That takes some getting used
to. There’s also a language switch. The XPage language of choice
is JavaScript, not LotusScript. However, there is a really nice consolidation
price here. Many of our familiar @Functions and also the Notes Document
Object Model has been implemented in JavaScript. That saves a lot
of time, and is like having you’re favorite pillow with you for a long
road trip. The only catch is that if you’re just getting started in JavaScript,
there’s no book on the language that tells you how to mix JavaScript with
the Notes Object model. You’re on your own for that. But more
and more examples are starting to appear.
For me, the absolute biggest hurdle
that I’ve found is that we really need to “Think Different”. You are
going to need to change your programming methodology when working with
XPages because XPages allow you to do things that would be difficult and
time consuming in normal Domino Web Development and down right impossible
in traditional Notes Client development. XPages gives you the concept
of scoped variables, which are variables that can stay in memory for different
lengths of time. For example, there is a session scope variable that remains
resident in memory when the user switches page views. No need to
pass data along, or save data somewhere only to retrieve it again when
the user moves to a new web page.
XPages give you the ability to
do a dbLookup from inside a view. Finally, Notes programmers can
do the equivalent of a SQL Join. Try that in the Notes Client!
There is a powerful new concept
that uses “Panels” and “Repeat Controls”. This allows you to do many
interesting things. One use will be the ability to create a “table” with
unlimited rows. You can allow the user to add rows on demand. Another
interesting use is the ability to display view data, but not have it look
like a table. You can control where the fields where go and then
apply CSS Styling. For example, you might have a view of people,
but rather then showing them in a table, you’re displaying each person
in multi-line boxes. Then you could style it and make the “box”
look like a business card.
These new tools are very powerful.
The difficulty that I am having in transitioning to XPages is in
absorbing the examples that are now available. We’re starting to
get some great examples to look at. Declan
Lynch and John
Mackey have a bunch of great
examples on their websites. Steve
Castledine created the xWiki
application on OpenNTF.
The Domino
Designer Wiki has over 88
topics on XPages at the time of this writing. But almost all these
examples are all really encompassing. They are a like full 7 course
meal, when what I want is an appetizer sampler. Before I dive into
Repeat Controls I want to first learn how to create and modify documents.
Before I dive into applying styles and themes to a page I want to
know how to filter the contents of a view.
I’m primarily a Notes Client developer.
I’ve missed most of traditional Domino Web Development. It’s
not that I didn’t want to work on web apps. We just don’t do much
Domino web work at my company. While that has been a point of personal
frustration, in hindsight, XPages makes that not seem to bad anymore. XPages
are just very different that what’s been done up to this point, both in
the Client and on the Web.
What I plan to do is create an
XPages walk though of building an application, or at least, the shell of
an application. There will be lots of screenshots and maybe some
videos. I’m going to focus on methods and concepts that are going
to be familiar with a Notes Client developer. But I’m not going to try
not to assume too much knowledge of Notes Development overall. I
think we as a community need a little more focus on basic information to
help new developers starting out.
I don’t know how far I’ll
get and maybe I’ll learn something new along the way, but to me it looks
like the future to Notes is here, and it’s called XPages.