5 Replies Latest reply on Apr 21, 2008 9:09 PM by a a

    A realistic problem:How to show 3 records in one row by rich

    a a Novice

      A realistic problem:How to show 3 records in one row by rich:datatable?


      I am developing a web like
      http://www.360buy.com/ or http://www.newegg.com/

      As you can see, those webs shows 3 records in one row.

      I tryied jstl's c:forEach, but it's too slow to show page contains images.

      If i show one record per row by rich:datatable, the speed is ok.

      Now, how to implement this effect by rich:datatable???

      Below is the code implemented by jstl.
      But it's too slow! I can not endure it!


      
      
       <c:forEach var="rowCounter" items begin="0" end="2" step="1">
      
       <s:div rendered="#{latestSearchingAction.getHot(rowCounter+0)!=null}">
       <table width="100%" border="0" style="border: 1px solid #{a4jSkin.panelBorderColor}">
       <tr valign="top">
       <td width="33%" align="center" style="border-right: 1px solid #{a4jSkin.panelBorderColor};">
       <s:div rendered="#{latestSearchingAction.getHot(rowCounter+0)!=null}">
       <div>
       <h:outputLink target="_blank"
       value="/pages/erp/product/product.detail.#{globalConstants.urlPattern}?productId=#{latestSearchingAction.getHot(rowCounter+0).id}&amp;randomCode=#{latestSearchingAction.getHot(rowCounter+0).randomCode}">
       <s:graphicImage value="#{latestSearchingAction.getHot(rowCounter+0).image.dataOfThumbnail}"
       style="border: 0px solid black;"
       rendered="#{latestSearchingAction.getHot(rowCounter+0).image!=null and latestSearchingAction.getHot(rowCounter+0).image.dataOfThumbnail!=null}">
       </s:graphicImage>
       <h:graphicImage value="#{latestSearchingAction.getHot(rowCounter+0).imageLink}"
       width="#{globalConstants.widthOfProductThumbnailPortrait}px"
       rendered="#{latestSearchingAction.getHot(rowCounter+0).image==null or latestSearchingAction.getHot(rowCounter+0).image.dataOfThumbnail==null}"/>
       <div>
       <h:outputText
       value="#{latestSearchingAction.getHot(rowCounter+0).getLocaledName(localeSelector.language)}"
       style="word-break:break-all;word-wrap:break-word;"/>
       </div>
       </h:outputLink>
       </div>
       <div>
       <h:outputText style="font-size:15px;font-weight: bold;line-height: 150%;" value="sellPrice:&#160;"/>
       <h:outputText value="#{latestSearchingAction.getHot(rowCounter+0).sellPrice}&#160;#{latestSearchingAction.getHot(rowCounter+0).priceUnitMenu.getLocaledName(localeSelector.language)}/#{latestSearchingAction.getHot(rowCounter+0).sellingUnitMenu.getLocaledName(localeSelector.language)}" />
       </div>
      
       <div>
       <a4j:commandLink
       action="#{globalOperatingAction.addToCart(latestSearchingAction.getHot(rowCounter+0).id)}" immediate="true"
       onclick="alert('added to cart...');">
       <h:graphicImage value="/img/cart.gif" />
       <h:outputText
       style="font-size:15px;font-weight: bold;line-height: 150%;"
       value="add to cart" />
       </a4j:commandLink>
       <div>
       <h:outputLink target="_blank"
       value="/pages/shop/productComment.detail.#{globalConstants.urlPattern}?productId=#{latestSearchingAction.getHot(rowCounter+0).id}&amp;randomCode=#{latestSearchingAction.getHot(rowCounter+0).randomCode}">
       <h:outputText style="font-size:15px;font-weight: bold"
       value="view/add comments" />
       <h:outputText
       style="font-size:15px;font-weight: bold;line-height: 150%;"
       value="[total:#{latestSearchingAction.getHot(rowCounter+0).hitsOfComment}]" />
       </h:outputLink>
       </div>
       </div>
       </s:div>
       </td>
       </tr>
       </table>
       </s:div>
      
       </c:forEach>