代码之家 › 专栏 › 技术社区 › sissi49

在多行和多列中显示多张照片并重复

xpages

sissi49 · 技术社区 · 12 年前

我想在一个窗口中显示几行3列的照片。

图像1图像2图像3

图像4图像5图像6

图像7图像8图像9

图像10图像11图像12

事实上,我发现照片1、2和3和其他照片在照片3后面,但不可见。。。

image1 image2 image3[image4 image5 image6 image7…]

这是我的代码:

<xp:table>
                <xp:tr> 
                <xp:repeat id="picturesRpt" value="#{dsvListePhoto}"
                    indexVar="i" var="picture" rows="3" >

                    <xp:panel>
                        <xp:this.data>
                            <xp:dominoDocument var="pictureDoc"
                                action="openDocument"
                                documentId="#{javascript:picture.getUniversalID()}"
                                ignoreRequestParams="true">
                            </xp:dominoDocument>
                        </xp:this.data>

                        <xp:div>
                            <xp:td>
                            <xp:div styleClass="listePhotos">
                                <xp:div>                                            
                                        <xp:image id="image1">
                                            <xp:this.url><![CDATA[#{javascript: "http://monserveur/devpt/Xpages/xphoto/PhotoWeb.nsf/" + compositeData.vueUtilisee + "/" + pictureDoc.getDocument().getUniversalID() + "/$File/TIMBRE_image.jpg?OpenElement"}]]></xp:this.url>
                                        </xp:image>
                                        <xp:text
                                            value="#{pictureDoc.Titre}" />
                                                                        <xp:br></xp:br>
                                </xp:div>
                                <xp:div>
                                    <xp:text
                                        value="#{pictureDoc.IdNiveau1} / #{pictureDoc.IdNiveau2}" />
                                </xp:div>

                        </xp:div>
                    </xp:panel>                 

                </xp:repeat>
                </xp:tr>
                </xp:table>

一个主意? 谢谢你的帮助!

2 回复 | 直到 12 年前

Knut Herrmann 12 年前

当您决定创建桌子有三列 完成并开始表行 每三张图片。添加 </tr><tr> 每当一个新的表行开始时。当indexVar i为3、6、9等时就是这种情况。

enter image description here

添加 </tr>&书信电报;tr> 标记,并使用呈现的条件

(i > 0) && (i%3 == 0)

您的代码如下所示:

<xp:table>
    <xp:tr>
        <xp:repeat
            id="picturesRpt"
            value="#{dsvListePhoto}"
            indexVar="i"
            var="picture"
            rows="1000">
            <xp:text escape="false">
                <xp:this.rendered><![CDATA[#{javascript:
                    (i > 0) && (i%3 == 0)   }]]></xp:this.rendered>
                <xp:this.value><![CDATA[#{javascript:
                    "</tr><tr>"             }]]></xp:this.value>
            </xp:text>
            <xp:td>
                ... picture ...
            </xp:td>
        </xp:repeat>
    </xp:tr>
</xp:table>

Paul Stephen Withers 12 年前

使用@Modulo或其他数学工具计算出除以3的余数。这将允许您计算是否添加添加“”或“”标记的Computed Text。

我在我与Mike McGarel的IBM Connect 2013会话中,在Steroids的Repeats页面上用两个专栏做了类似的演示。幻灯片和演示数据库的链接在我的博客上,文章底部,youtube视频下面 http://www.intec.co.uk/session-slides-and-sample-database-from-ibm-connect/

它也作为TLCC网络研讨会发布,尽管我找不到链接。从Niklas Heidloff的博客上看,好像拍了一段视频 http://heidloff.net/home.nsf/dx/16.04.2013093214NHEAUQ.htm