Xpage动态加载定制控件

在开发工作中遇到了一个多合同的问题，也就是一个页面上要加载十几个合同div；原来的web设计方案是将这个十几个合同的div全部预先写在一个subfrm里面，用display：none来隐藏，尽管是在browser上不显示了，但是浏览器依然将html代码进行了解析，再加上一些计算公式在里面，严重拖慢了页面的加载速度；xpage可以动态加载控件，因此考虑使用xpage来完成这项工作。

感谢梁骞的文章《XPage 高级技术 -- 动态创建控件》https://www.ibm.com/developerworks/cn/lotus/ls-cn-xpage-advance/；在这篇文章里，他介绍了动态创建控件的方法还有动态加载定制控件的方法，如何绑定事件，绑定数据源等，让我获益匪浅。本篇文章就是在阅读了他的文章之后，进行了开发尝试，成功之后所作的记录。

现在testDynamicAddCtrl.xsp页面中放置一个面板（panel）作为加载定制控件的容器；在xpage页面中放置一个按钮，用于触发添加事件；接下来，编写动态加载的代码。

var customCtrl = new com.ibm.xsp.component.UIIncludeComposite();    //创建自定义控件对象
//下面这部分是根据我的需求调整的，需要多次添加不同的控件
var index = (num-1).toString();
var CtrlId="";
if(index==0)
    CtrlId = "Control_MainForm";
else
	CtrlId = "Control_MainForm_"+index;
//设置自定义控件的名称和id
customCtrl.setPageName("/"+CtrlId+".xsp");
customCtrl.setId(CtrlId);
//创建自定义控件的生成器类
var objBuilder = new com.ibm.xsp.extlib.builder.ControlBuilder();
//获取自定义控件的实现类
var classControlImpl = objBuilder.getClass().getDeclaredClasses()[1];
//获取容器控件，即xpage页面上提前设置的panel
var panelcontainer = getComponent("panel");
//创建容器控件对象
var objImplParent = new classControlImpl(panelcontainer);
//创建你的自定义控件
var objImplControl = new classControlImpl(customCtrl);
//个人需求，因为我一次只需展示一个合同的信息，所以panel中只需要一个控件就可以了
//因此每次添加自定义控件前，将panel中包含的控件清除
if(objImplParent.getComponent().getChildren().length>0) 
	objImplParent.getComponent().getChildren().clear();
//将自定义控件添加进panel中
objImplParent.addChild(objImplControl);
//使用控件生成器重构父节点panel，从而将自定义控件添加进xpage页面当中
objBuilder.buildControl(facesContext,objImplParent,false);

objImplParent.getComponent().getChildren().length和objImplParent.getComponent().getChildren().clear()这两个方法的调用花费了我不少时间去解析xpage的扩展包的class文件得到的；getChildren()返回的是一个list对象，所以可以使用这两个方法；感兴趣的同学可以自己解析来看看，jar包所在的位置是\Notes\osgi\shared\eclipse\plugins\com.ibm.xsp.extlib.core_9.0.0.v00_00_20130301-1506.jar。

 如此一来我就可以实现动态添加我想要查看的合同信息了，不用像web表单一样一次加载那么多资源了，页面的响应速度也缩短了。