4

How do we determine the sequence of a component presentation in a particular region on the page? I am using DXA JAVA.

The design has 4 blocks having divs something like:

<div class="tab1"> Block 1 </div>
<div class="tab2"> Block 2 </div>
<div class="tab3"> Block 3 </div>
<div class="tab4"> Block 4 </div>

I want to make the design flexible, so that tab number is generated by the sequence of component presentation in that particular region.

How can this be achieved in the view?

  • Have you tried looking through the view and controllers to find this information? – Nickoli Roussakov Aug 21 '15 at 13:15
  • I think a correct answer would essentially be the DXA equivalent of TemplateRepeatIndex. – Alvin Reyes Aug 22 '15 at 15:19
  • Nickoli, No, I still need to look in details. I am new to MVC + Java DXA, sos till digging up @Alvin, looks good, struggling to find the java equivalent. – Huston Lopes Aug 22 '15 at 21:29
  • There is no "template repeat index" equivalent in the view helpers. It is not that obvious how to provide that. Maybe the region view could pass the index in a custom <dxa:entity tag but would the equivalent of the shared context between compound Page Templates and ComponentTemplates (not a desirable situation). – Jan H Sep 11 '15 at 5:05
2

In your view you are most likely looping over the entities in this region, that is the location where you have access to the sequence, so for example:

<div ${markup.region(region)}>
<%
  final int cols = 2;
  final int rows = (int) Math.ceil(region.getEntities().size() / (double) cols);
  final Iterator<EntityModel> iterator = region.getEntities().values().iterator();
  for (int row = 0; row < rows; row++) {
    %><div class="row"><%
    for (int col = 0; col < cols && iterator.hasNext(); col++) {
      final EntityModel entity = iterator.next();
      %><div class="col-sm-6"><dxa:entity region="2-Column" entityId="<%= entity.getId() %>"/></div><%
    }
    %></div><%
  }
%>
</div>

This view is breaking up the entities in 2 column rows, you can use a similar process to generate your classes.

You can also take a look at the tab view we used (https://github.com/sdl/dxa-web-application-java/blob/develop/core-module/src/main/resources/META-INF/resources/WEB-INF/Views/Core/Entity/Tab.jsp), from which you will notice a proper HTML design does not need indexes in its tab classes to display them correctly (but that is perhaps something you should discuss with your designers).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.