Articles
PermaLink XPages tip: Programmatically jumping to a page on a View or Pager control02/24/2010 07:30 AM
Domino 8.5 - XPages
In the Dynamic View Custom Control I built, and is available on OpenNTF, I noticed that the pager control does not reset when I switch datasources.  The Pager control does not reset because the custom control is not reloaded in the demo I put together.  So I was looking for a way to reset the control programmatically and I came across this article from Matt White on the XPagesblog and then also came across the same answer on IQJam (both are great resources!).

The article shows you how to get a class in JS in the Designer so that you can browse the methods that are available to you.  So for example if you want to jump to a certain page for a View control or Pager control you can use this "gotoPage()" method.

For a Pager:
var pager:com.ibm.xsp.component.xp.XspPager = getComponent("pager1");
pager.gotoPage(1);  //0 is first page etc.,.

For a View:
var view1:com.ibm.xsp.component.xp.XspViewPanel=getComponent("viewPanel2");
view1.gotoPage(1);

Here's a screen shot of the script editor and some of the methods available for a View control.  As you can see there is also gotoFirstPage(), gotoLastPage(), gotoNextPage(), gotoPreviousPage(), and gotoRow().

Image:John's Blog - XPages tip: Programmatically jumping to a page on a View or Pager control


-John
Technorati:
(2)

PermaLink XPages Dynamic View Custom Control - on OpenNTF.org02/16/2010 03:46 AM
Domino 8.5 - XPages
I created an XPages custom control that dynamically builds a view based on a series of passed in parameters.  Normally with XPages, if you want different views to be displayed on your XPage, you would create the multiple view controls and hide the ones that should not be displayed.  This custom control allows you to drop a single CC on your XPage and it can generate the views for you.  Cick here to open the OpenNTF.org project.

Overview

I included a sample page and test data so you can try the Custom Control out.

When you first launch the database, click on a view to generate: Projects, Customers, or Orders.

Image:John's Blog - XPages Dynamic View Custom Control - on OpenNTF.org



When you click on one of the view links I set session scope variables for the view parameters.  You can pass these parameters anyway you like or compute them too. For the demo I chose session variables. You can even build an interface so the users can tailor their own views.  Here's a sample of setting the parameters for the Project view:

Image:John's Blog - XPages Dynamic View Custom Control - on OpenNTF.org



On the Custom Control, you can see how I pick up the Session Variables and pass them to the control:

Image:John's Blog - XPages Dynamic View Custom Control - on OpenNTF.org



To further demonstrate how you can change the view dynamically, I added a custom control that has input controls bound to the session variables.  This allows you to change any of the parameters and click the "Build View" button to regenerate the view.  So you can change the order of the fields, the width of the view, link column etc.,  

*Note: the fields do not have to be physically in the view.  I grab the fields from the backend document:

Image:John's Blog - XPages Dynamic View Custom Control - on OpenNTF.org


The ccDynamicView control is actually very small.  It consists of 2 nested repeat controls with a pager control:
Image:John's Blog - XPages Dynamic View Custom Control - on OpenNTF.org


I used Paul Calhoun's example Creating a Dynamic HTML Table on an XPage to add the columns to the tables as it iterates through the field list.  By adding the <xp:td> tags around the repeat controls the Outline palette seemed to object to this and will not let me select the repeat control anymore with my mouse. This makes it difficult to edit the custom control through the interface. If you need to make changes, you need to use the source view.

This repeat control builds the columns and the view header by exploding the list of columns and iterating through them:

        <xp:tr>
                        <xp:repeat id="repeat2" rows="30"
                                value="#{javascript:@Explode(compositeData.columns)}" var="colName"
                                indexVar="colIndex" first="0">
                                <xp:td>

                                        <xp:text escape="true" id="computedField1"
                                                value="#{javascript:colName;}"
                                                style="color:rgb(0,0,128);font-weight:bold">

                                        </xp:text>
                                </xp:td>
                        </xp:repeat>
                </xp:tr>


The next repeat control retrieves the data set for the view depending on the fulltext and category parameters, and then retrieves the field values for document.  Along the way it formats the rows for alternating color and builds the href links.


Cons
On the downside to using this custom control, the view cannot be expanded and collapsed.  Nor is their the ability to click a column heading and sort the data.  If anyone knows how to add that feature please comment!  

-John

Technorati:
(5)

PermaLink Free Domino Designer 8.5 Courseware02/07/2010 09:03 AM
Domino 8.5
The folks over at TLCC are providing a "free" introductory level Domino Designer 8.5 course.  If you have some newbie Domino developers in your group, Domino developers that want to start learning XPages, or administrators that want to get up to speed on development, you should check out this course.  

From my past experience, TLCC provides high quality courses with a focus on details.  It is delivered within the Notes 8.5 client, which you can also download for free from IBM.  Using the Notes client allows you to learn at your own pace and perform the corresponding exercises in the Designer.  I had the opportunity to review their full blown XPages course last year and would recommend it to anyone wanting to learn XPages.  Click here to read that review.

Here's an overview of the course modules:
  • What is Notes and Domino software?
  • The role of the Notes client and Domino server
  • Domino Application Architecture
  • Using Domino Designer software
  • Creating a Domino Application
  • Creating Forms and adding fields
  • Designing Views
  • Creating XPages for your application
  • Programming options in Domino Designer applications
  • Deploying a Domino application

For more details visit the TLCC site.  Nowadays, everyone could appreciate free courseware....
Technorati:
(1)

PermaLink Domino 8.5 DDE Tip - How to edit multiple design elements in the same window. (Agents, Forms, Views, XPages, etc. )02/01/2010 05:50 AM
Domino 8.5
Now that Domino Designer 8.5 is based on Eclipse, you can take advantage of some built in Eclipse features.  Eclipse provides the capability for editing multiple elements in the same design window by splitting the window either horizontally or vertically.

Let's say you want to edit an XPage and a Custom Control together.  Open up both the XPage and Custom Control as you normally would.  Open up the Custom Control. Now drag the XPage tab onto the currently opened Custom Control in the design pane.  Release the mouse when the icon turns to a black arrow and a black shaded outline appears:
Image:John's Blog - Domino 8.5 DDE Tip - How to edit multiple design elements in the same window.  (Agents, Forms, Views, XPages, etc. )


Once the mouse is released the screen will split and contain both design elements:
Image:John's Blog - Domino 8.5 DDE Tip - How to edit multiple design elements in the same window.  (Agents, Forms, Views, XPages, etc. )


This is not limited to XPages.  If you want to edit a Lotusscript agent and view the associated Notes Form at the same time you don't  need to flip back and forth between tabs anymore.  You open both design elements as normal.  Click on the Form tab.  Now drag the Lotusscript Agent tab onto the opened window toward the right side of the screen this time:
Image:John's Blog - Domino 8.5 DDE Tip - How to edit multiple design elements in the same window.  (Agents, Forms, Views, XPages, etc. )

Here you can see the Form and Agent side by side:
Image:John's Blog - Domino 8.5 DDE Tip - How to edit multiple design elements in the same window.  (Agents, Forms, Views, XPages, etc. )

If you need more real estate temporarily, you can double click on the design elements title and it will maximize that window.  Double clicking again will restore the window size.

To move the split window back to it's original tab you can drag the window back to the Tab bar and the window will return to normal.

Good stuff....

-John
Technorati:
(1)

PermaLink XPages: Generate Dynamic Views at runtime - Custom Control....opinions wanted01/28/2010 08:04 AM
Domino 8.5 - XPages
I was working on an application where I had a number of views on an XPage that I would hide/show depending on the navigation selected.  I thought it would be great not to have to embed every view on the page, plus build out all the XPages views.

Just for fun I looked into creating a custom control that would accept the view name, the columns/fields, the link to open, etc. as parameters. The custom control would then generate the view for me. It turned out not to be so difficult to build...at least a scaled down version of a view control.

There's more to do though, but I was curious before I put more time into this if this is something folks could use?  Please comment and let me know if you could use something like this and I'll finish it and publish it on openNTF.org.  You can try out the example here: Dynamic View Custom Control

Here's a screen shot of it in action.  The top section is for demo purposes only.  The view name, columns, etc., can be passed via scope variables (or anyway you want).  There might be a use case to allow users to save their view preferences in a profile or config document.  (the data in the example db is garbage, that's why it looks to be duplicated):

Image:John's Blog - XPages: Generate Dynamic Views at runtime - Custom Control....opinions wanted

So far, here are the parameters that I pass to the custom control.
Image:John's Blog - XPages: Generate Dynamic Views at runtime - Custom Control....opinions wanted

The custom control uses nested repeat controls to build the view.  I used Paul Calhoun's example Creating a Dynamic HTML Table on an XPage to add the columns to the tables as it iterates through the field list.  By adding the <xp:td> tags around the repeat controls the Outline palette seemed to object to this and will not let me select the repeat control anymore with my mouse.  I have to work on that because it's torture to work with like this....

Here's a screen shot of the custom control with the nested repeat controls.  Not much to it.  Right now I'm being challenged to add a sorting feature to the columns.  Any ideas?:
Image:John's Blog - XPages: Generate Dynamic Views at runtime - Custom Control....opinions wanted

-John
Technorati:
(9)

PermaLink XPages Running in the Notes Client, Composite Applications, Mashups, and Websphere Portal!10/19/2009 05:56 AM
Domino 8.5
With the 8.5.1 release you can now run your XPages applications in the Notes client, composite applications, Mashup Center, and Websphere Portal.  

Imagine taking some of your key Notes applications and adding an XPage front end to some core corporate functionality.  Then componentizing those XPages and publishing them as components to your catalogs for consumption.  Notes users can then add them to composite applications and take them offline, a Mashup Center user can add them to a mashup along with their sales projection spreadsheet, Portal users can wire them to their dashboards for drill down capabilities.  All of this with one development tool, the Domino Designer!

The great thing here is this is not just surfacing your Notes data in these other platforms.  This is providing the same Web 2.0 applications and functionality that Xpages delivers in a web browser to these platforms.

There are 2 new design elements/features in 8.5.1 that make all this possible:
- The ability to run your XPages applications in the Lotus Notes client, both on the server or locally.
- The new Component design element that allows you to split up your XPages applications into components for wiring in composite applications.  Once you have defined your components, they are immediatley available to run in Notes Composite applications, the Mashup center or Websphere Portal as iWidgets....without any code changes!

All this with minimal design effort required on your part....point and click, drag and drop and you now created a component that has properties and events for wiring.

I have a new article published on The View that goes in depth step by step on how to utilize all these new features.  It shows you how to create components and run your XPages applications in the Notes Client, composite applications, Mashup Center, and Portal.  You can access the article here: Domino Designer 8.5.1— XPages in the Notes Client, Composite Applications, Mashups, and Portal!  (*requires login)

Here's a preview:

Web Client and Notes Client
This is an image of the sample XPages application running in a browser and also running in the Notes client.  In this example I am using the same theme.  Note the use of the @ClientType() formula in a computed field displaying what client the application is running in. You can use the @ClientType() formula in any JavaScript computable property to tailor the page to the client or the browser.
Image:John's Blog - XPages Running in the Notes Client, Composite Applications, Mashups, and Websphere Portal!



Notes Client as Components in a Composite Applications
In this screen shot I took the XPages application and created two components from it.  It is very easy to add actions for the wiring since there are new client side simple action available.  When the customer link is clicked it fires off the events sending the customer name and the customer address.    The viewOrders component receives the customer name and filters the orders view to show only the orders for this customer.  The Google map receives the address and opens up a street map showing the location.
Image:John's Blog - XPages Running in the Notes Client, Composite Applications, Mashups, and Websphere Portal!


Mashup Center
This picture shows the same components running in a mashup in the Mashup Center without any changes from the Notes client version!  The Domino server projects the components as iWidgets for us so there is nothing we need to do to use them in the Mashup Center....just drag and drop and add the wiring.
Image:John's Blog - XPages Running in the Notes Client, Composite Applications, Mashups, and Websphere Portal!

Websphere Portal
Here is a screen shot of the XPage component running in Websphere Portal in the iWidget portlet along side two Portlet Factory generated portlets.
Image:John's Blog - XPages Running in the Notes Client, Composite Applications, Mashups, and Websphere Portal!

This is really an amazing release!  It is packed with hundreds of fixes and new features.  These new features really open the door to developing applications for platforms that might have been previously out of reach for Domino developers.

A special thanks to Stephan Wissel and Henry Christiaan who helped me troubleshoot issues I was having with the iWidget portlet in Portal.  I was having problems getting the portlet to work in my test environment across my VMware servers.  The resolution was to adjust the Ajax security settings in the portlet proxy-config.xml to allow across servers and port access.  These guys recently demoed similar functionality at the IBM Portal Excellence Conference 2009 in Macau China.  Thanks for your help!

-John
Technorati:
(1)

PermaLink XPages: The View article(s) - How to Compute a Custom Control at Runtime09/13/2009 10:40 AM
Domino 8.5
I recently had 2 articles published in The View that demonstrate how to compute which custom control to display at runtime based on a formula.  This is similar to using a computed subform in traditional Notes/Domino development.  

The first article provides the technical overview on how to accomplish this using a built-in XPages feature.  The second article expands on the first by enhancing the custom control to allow the use of parameters so that it can be re-used in any of your applications.

Here's a synopsis of the articles.  (the full articles require a subscription login)

XPages — How to Compute a Custom Control at Runtime
     
       
When Domino developers first start exploring XPages, they naturally tend to compare the new XPages controls and functionality with traditional IBM Lotus Notes and Domino development: “I know what I want to do and how I would have accomplished it with Domino Designer. Now how do I do it in XPages?”

Take the concept of a Notes computed subform. I have heard many developers asking how this is handled in XPages. While many Notes concepts are handled the same way in XPages as in traditional Notes development, the computed-subforms concept is not one of them.

The XPages design component that most closely corresponds with subforms is the custom control. You use a custom control where you have a group of fields or functionality that you want to reuse on other XPages within your application. Once created, a custom control shows up in the Controls palette. Then you can drag and drop the control onto any XPage in your application.

In Notes, you can compute which subform to include on a form based on a formula. Computing which subform to include at runtime is an easy way to tailor the form and functionality without having to maintain numerous hide/when formulas. This is a very valuable feature for rapid application development. With XPages, however, there is no computed custom control. I’ll show you a technique to help you get functionality in XPages that is similar to computed subforms.
 
XPages — A Reusable Solution for Computing a Custom Control at Runtime
In XPages development, you use a custom control when you have a group of fields or functionality that you want to reuse on other XPages within your application. In an earlier article (THE VIEW, 2009) I showed you how to use a custom control that computes which custom control to display on an XPage at runtime, similar to using computed subforms in Domino Designer.

Now I’ll show you how to enhance that custom control so you can reuse it in any XPages application to compute any custom control at runtime. Plus, I’ll show you how to create custom control properties for parameters that can be accessed with serverside JavaScript. Learning how to parameterize your custom controls will enable you to build your own library of reusable controls for rapid application development.

-John

Technorati:
(1)

PermaLink XPages - How to pass a Document Data Source to a Custom Control08/17/2009 06:29 AM
None
In a previous article I explained how you can use the undocumented currentDocument data source object to get the data source for the XPage from a Custom Control.  This works great if the XPage has one data source. What if you have multiple data sources?  For example, you want to include a custom control within a repeat control that is accessing multiple documents from a document collection or a view.  The currentDocument variable would only point to the first data source on the XPage.

At first glance, looking at the data types that are available for parameters in a Custom Control, you cannot pass a data source object. The type list drop down is a list of standard JavaScript variable types.

Image:John's Blog - XPages - How to pass a Document Data Source to a Custom Control



But, if you click on the folder icon next to the Type field you will see an extended list of type available.

Image:John's Blog - XPages - How to pass a Document Data Source to a Custom Control


Then from your XPage you can pass the datasource using computed JavaScript, such as: "OrderDetails.getDocument();"

*updated - see note below

Image:John's Blog - XPages - How to pass a Document Data Source to a Custom Control

Binding fields on a Custom Control to a dynamic datasource
The second part of this can be tricky.  On your Custom Control you cannot use the "Simple Data Binding" option to bind your fields since you have no datasource set for the Custom Control, the datasource is dynamic.  

The perfect solution for this is to use the Advanced -> Expression Language (EL) binding.  For example, to bind the field to the "Comment" field, we would use "compositeData.docdatasource.Comment".  Where....
- compositeData holds all the parameters for the Custom Control
- docdatasource is the parameter that we created that receives the datasource
- Comment is the field name on the Notes form

Image:John's Blog - XPages - How to pass a Document Data Source to a Custom Control

Now, with that said, there is an issue with this in 8.5.  DDE tries to convert the EL expression to a Simple data binding when you save and reopen the Custom Control. So it works the first time you enter it, but loses the binding when you edit the Custom Control.  However, it looks like this is fixed in 8.5.1.

BUT, no sweat, I have a workaround.  If you select JavaScript for the binding type, select "Compute on page load", and then enter the formula as '#{compositeData.docdatasource.Comment}' it will continue to work.

Image:John's Blog - XPages - How to pass a Document Data Source to a Custom Control


Here's an example of the Custom Control used with multiple Data Sources in action:

Image:John's Blog - XPages - How to pass a Document Data Source to a Custom Control

You can download this example here.

*update - by passing the NotesXSPDocument instead of the NotesDocument, the fields will automatically handle whether the document is in read or edit mode.

To do this, select "ModelDataSource" as the type for the property.  Then when passing the datasource from your XPage change the JavaScript from "OrderDetails.getDocument()" to just "OrderDetails".

-John

Technorati:
(0)

Search
Partner with us
Need help on your XPages projects?

Talk to the experts! Read more...
Powered by
Blogsphere
Lotus Domino ND7 RSS News Feed RSS Comments Feed Geo URL netcraft RSS Validator Lotus Geek Chris. A. Brandlehner OpenNTF BlogSphere