I recently installed the Extension Library containing objects responsive In particular I was using the Dashboard component. I was trying to figure out how to dynamically create DashNode with programmatically.
There is a mode for to do this activity from SSJS ?
I was doing some experimentation recently for dynamically creating a Carousel control. I'll post the code that achieved it below, and it should give you the starting point for what you need to do to create a Dashboard dynamically. If you can't figure it out, or have further questions, then I may be able to look specifically at a Dashboard version at some point, if I find the time.
<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>
The key is to first get a reference to the component underlying the Carousel control, UICarousel
. Then create some SlideNode
components, setting their configuration options as desired, and add them to the UICarousel
component.