Learning XPages Part 12 : Preparing Our First Sidebar Widget

Now that we have the main look and feel
of our XPages Phonebook application done it is time to start showing some
actual data on the XPage. From my own experience I have found that it is
easier to get the data displaying on the XPage before linking it to other
XPages so right now we are going work on adding our first component to
the sidebar on the left of the screen.

We will start by going to the custom
controls view in the Domino Designer and creating a NEW custom control.
While we could write our code directly into the layout_LeftSidebar control
the choice to use a new Custom Control means that we have more control
over when it appears in the sidebar and by breaking the application down
into smaller parts you can easily reuse parts in other applications. I
have called my new custom control sb_LocationsList, This naming convention
tells me that it is something that goes in a sidebar.

Once you have created the new custom
control just add some placeholder text save it and then open up the layout_LeftSideBar
custom control so we can embed our new custom control inside of it. To
put the custom control into the sidebar you just drag it from the custom
controls pane on the right side of your screen to where you want it in
the sidebar. You will need to pop into the source view to make sure it
is between the div’s that we created earlier. Here’s what my final layout_LeftSidebar
looks like :

A picture named M2

Now when we save and preview our site
we’ll see the placeholder text from inside the sb_LocationsList appearing
instead of the original placeholder text from the layout_LeftSideBar.

A picture named M3

In the next part we will replace the
placeholder text with a real list of locations

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