在XPAGES上动态创建dash节点

时间:2015-11-30 22:15:55

标签: xpages xpages-ssjs xpages-extlib

我最近安装了包含响应对象的扩展库特别是我使用的是Dashboard组件。我试图弄清楚如何以编程方式动态创建DashNode。

SSJS有一种从事这项活动的模式吗?

1 个答案:

答案 0 :(得分:1)

我最近正在做一些动态创建Carousel控件的实验。我将发布下面实现它的代码,它应该为您提供动态创建仪表板所需的起点。如果您无法弄明白或有其他问题,那么如果我找到时间,我可能会在某个时刻专门查看仪表板版本。

<xp:this.afterPageLoad><![CDATA[#{javascript:importPackage(com.ibm.xsp.theme.bootstrap.components.responsive);

        var photos = [["http://www.gstatic.com/webp/gallery/1.jpg","My Caption 1"]];
        photos.push(["http://www.gstatic.com/webp/gallery/2.jpg","My Caption 2"]);
        photos.push(["http://www.gstatic.com/webp/gallery/3.jpg","My Caption 3"]);
        photos.push(["http://www.gstatic.com/webp/gallery/4.jpg","My Caption 4"]);
        photos.push(["http://www.gstatic.com/webp/gallery/5.jpg","My Caption 5"]);

        var carousel:com.ibm.xsp.theme.bootstrap.components.responsive.UICarousel = getComponent("carousel1");

        for(var i = 0; i < photos.length; i++) {
            var data = photos[i];

            var slide:com.ibm.xsp.theme.bootstrap.components.responsive.SlideNode = new com.ibm.xsp.theme.bootstrap.components.responsive.SlideNode();
            slide.setBackgroundSrc(data[0]);
            slide.setCaptionText(data[1]);
            slide.setButtonLabel("Open This Image");
            slide.setButtonHref("/photo.xsp?photo=" + data[0]);
            carousel.addSlideNode(slide);
        }}]]>
</xp:this.afterPageLoad>

<xe:carousel id="carousel1" wrapped="true" pause="hover" slideInterval="2000">
</xe:carousel>

关键是首先获得对Carousel控件底层组件的引用UICarousel。然后创建一些SlideNode组件,根据需要设置其配置选项,并将它们添加到UICarousel组件。