The XPages Blog

UPDATE:  Jeremy Hodge points out the built-in method XPages has for allowing you to do this in the comment below.  Based on that, I've updated the demo and re-recorded it.  So, if you've watched the first one, watch the new one.  The premise, or needs, are the same as what's described below.  The solution is better.

The better approach:

---

What the heck does that mean???  Well, here's a scenario. I've taken the time to build a PieChart custom control.  I'd like to be able to drop that PieChart on an XPage multiple times for multiple different charts.  But how can I make that happen without hard-coding the configuration into the control itself?  I would need to be able to PASS that data into the PieChart control from the containing page. 

So if I use something like viewScope.put('PieChartConfig', config) into the XPage, that solves getting data TO the control, but only for 1 instance of the control.  For example, the control would receive that data with viewScope.get('PieChartConfig', config).  But now I can only have 1 control on the page because each instance of the control would be getting the same config.

Somehow each INSTANCE of the control has to be able to get its own data configuration.  Here's how.

When we put each instance of the PieChart custom control on the XPage, we're allowed to name that instance, just like we name any other control.  So, PieChart1, PieChart2, etc...

Now from the XPage, we can modify our earlier code and do something like this:

viewScope.put('PieChartConfig', {'PieChart1':config1, 'PieChart2':config2});

Inside the PieChart control, we can get the config that's intended for that instance by having a control on the page like a computed field with the name of 'sId' which has the value of:

var idArray = getClientId('sId').split(':');
idArray[idArray.length-2]

This will be the name assigned to the custom control instance inside the containing XPage.

To get the config that's specific to this instance of the control, we'd use:

var ConfigAll = viewScope.get('PieChartConfig');
var ConfigMe = d[getComponent('sId').value]

I've recorded a quick (2 min) video example of this, and an .nsf with that code.  Hope this helps.