Learning XPages Part 15 : Building The Homepage Content
Tags : Lotus Domino XPages Repeat Custom CSS
Bookmark :
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 Content\Locations view in my database.
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.
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.
and if you save and refresh your XPage you'll see some real data appearing in your application.
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.
Bookmark :
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 Content\Locations view in my database.
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.
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.
and if you save and refresh your XPage you'll see some real data appearing in your application.
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.
