Render child component when parent component rendered property is false?

289 views Asked by At

I want to create a grid like this:

Element1 Element2 Element3

Element4 Element5 Element6

I have the following code:

<ui:repeat value=#{beans.myElementList} var="element" varStatus="i">
   <b:row rendered=#{i.index%3==0}>
      <b:column medium-screen="4">
         #{element.display}
      </b:column>
   </b:row>
</ui:repeat>

The result of my code:

Element1

Element4

How to solve this problem?

2

There are 2 answers

1
krokodilko On BEST ANSWER

Try the below code.
The first ui:repeat renders <row> for each 3 elements,
the second one renders elements (within <column>) in groups of 3 elements each.

<ui:repeat value="#{beans.myElementList}" step="3" varStatus="i" >

    <b:row>
        <ui:repeat value="#{beans.myElementList}" var="element"
                   step="1" offset="#{i.index}" 
                   size="#{i.index + 3 le beans.myElementList.size() ? i.index + 3 : beans.myElementList.size() }"
                   varStatus="j" >
             <b:column medium-screen="4">
                 #{element.display}
             </b:column>        
        </ui:repeat>
    </b:row>

</ui:repeat>
0
Stephan Rauh On

<b:panelGrid> to the rescue:

<ui:repeat value=#{beans.myElementList} var="element">
   <b:panelGrid columns="3" size="md">
     #{element.display}
   </b:panelGrid>
</ui:repeat>

<b:panelGrid> is inspired by the standard <h:panelGrid>, which renders an HTML table. Similarly, <b:panelGrid> renders a table consisting of Bootstrap rows and columns. Simply put everything you want to display into the panel grid. BootsFaces automatically detects when to render a new row.

The use case I originally had in mind is a form. More often than not, such a form is a repetition of identical lines: label, input field, error message. <b:panelGrid> allows you to create tabular forms like this with minimal effort.

Also see the documentation of <b:panelGrid>.

Addition until BootsFaces 1.2.0 is released: Looking at the documentation, I wasn't happy what I saw. So I've corrected and updated it. Until BootsFaces 1.2.0 is released, also see the documentation of the developer showcase.