1 - Getting Started with XPages By Rob McDonagh

2 - Harness the power of XPages in Lotus Domino Designer By Chris Toohey

3 - New XPage Tutorial By Peter Janzen

4 - XPage Examples by John Mackey

5 - Learning XPages By Declan Lynch

Today while working on one of the requirement, I encountered strange thing about onChange event behavior in Internet Explorer 7 and Mozila Firefox 3.

Actually my requirement was to show and hide div based on the radio button selection. I was having following code on "onChange" event of the radio button,



Code was executing very well on Mozila and everything was fine, But same stuff was working unexpected in Internet Explorer. According to the code , DIV A should visible if "Yes" was selected else DIVB should be visible. When I ran the code in IE, On selection of "yes" nothing was happening , but on selection of "No" DIV A was getting visible which was wrong. However that's the way "onChange" event should work but why Mozila is showing correct DIV on onchange event. I didn't got the answer by myself or even from the Google.

After few attempts, I didn't put much attention and put the code in "OnClick" event of the radio and it works well in both the browser. Just forsake checked in Google , found many people experienced the same. Anyways I had other stuffs to do so left there it is..

Would love to know if anybody get the answer :-)

Recently in my new project I have implemented flash/xml based charts powered by (www.fusioncharts.com). Great thing is that it's free to download and use. You need to pay if you wish to go for advance charts.So, Lets discuss those which can be downloaded with no cost. There are number of charts like, 3D/2D Column & Bar Charts,Line Charts,2D/3D Pie & Doughnut Charts,Area Charts,Stacked Charts, Gantt Chart and many more. Have a look here,
(http://www.fusioncharts.com/free/Gallery.asp).

FusionCharts are .swf file which takes xml data as a input and draws flash charts on .For domino implementation just add swf file in your File Resource , build your xml string, pass it in the chart and get the nice flash chart.

Actually, I have been implemented this long back in PHP, but never got such requirement to do in Lotus Notes. But when I got the requirement , I consider FusionCharts only because it's simple and great.

In this blog I will discuss everything starting from form designing to displaying chart. I will be using Bar chart in this example.Let's start now..

1- We are going to display number of "Site visitors" by month. To do so , Add text field in your form A called "Site Name". In next row add caption start from "Jan" to "Dec" ( in separate column) and at the end "Total" caption. Now add one number field for each month and one for calculating "Total" for the year. Put a formula on "Total" field to calculate total ( Jan+Feb+..+Dec).Here is the visual,



2- Run your form in notes and create some sample docs by feeding entry for each month.Something like,



3- Create one more form B ,which will share the same form name as Notes form ( which used to create document earlier) which will be used to open the document on web with chart.here is the visual,



4- Open Form B in designer and add first text field (Computed for Display) called "ColumnChart" and write following formula,

tmpProtocol:= "http" + @If(HTTPS="ON"; "s"; "");
txGraphURL:= "FC_2_3_Column3D.swf";
tmpProtocol + "://" + @GetHTTPHeader("Host") + "/" + @WebDbName + "/" + @URLEncode("UTF-8";txGraphURL)
( Assume you have downloaded swf file from fusionchart website and kept in your "file resources)

Next add text field (Computed for Display) called "ChartSize" and will have following formula ,

"900" : "345"

Next add text field (Computed for Display) called "Colors" and will have following formula,

"99CCFF" : "FF99CC" : "CC9900" : "99CC99" : "9999FF" : "FFCC66" : "CCCC66" : "9999CC" : "FFCCCC" : "99FFCC" : "CCCCFF" : "99CC66"

Next add last text field called "ChartData", which will compute feeded data and build xml . here is the formula for same,



Important :

1) Make sure all the tags are closed properly.
2) Parent tag (graph) is started and ended properly.
3) Data type conversion. Numbers must be converted into text.


5- Add following code on your form and pass thru ,



here are the formula used on in above code,




That's it. Open your document ( which you have created earlier) on web , it will display nice Flash chart for you by month wise. here it is,



You can even create complex one using AJAX which will dynamically build xml string and pass it to swf file.I have done similar stuffs using LS and ajax. Here is the sample using LS,



You can download working copy from OpenNTF.org, Here is the link,

http://www.openntf.org/Projects/pmt.nsf/ProjectLookup/Flash%20Charts%20for%20Domino%20web%20application

preload preload preload