Sightly List in 2 column table format | Community
Skip to main content
May 16, 2018
Solved

Sightly List in 2 column table format

  • May 16, 2018
  • 2 replies
  • 1893 views

Hi All,

I am using sightly for my list element, I came up with a requirement to generate my html mokeup like,

<table>

          <tr>

                <td> <input type="checkbox"/> <span> name1 </span> </td>

                <td> <input type="checkbox"/> <span> name2  </span> </td>

            </tr>

          <tr>

                <td> <input type="checkbox"/> <span> name3 </span> </td>

                <td> <input type="checkbox"/> <span> name4  </span> </td>

            </tr>

          <tr>

                <td> <input type="checkbox"/> <span> name5 </span> </td>

                <td> <input type="checkbox"/> <span> name6 </span> </td>

            </tr>

</table>

so instead iterate over <li> element, I need to show result in two column,

Is there anyway  this can be done, or If i can use javascript Use API to generate this short of dynamic html content by passing my list object.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by smacdonald2008

Typically you are iterating over the Collection in a HTL front end,

<h2>Current Issue</h2>

<div

    data-sly-use.multiItems="com.htl.community.coral.core.models.Multifield">

    <div data-sly-list.head="${multiItems.products.listChildren}">

        <div style="height:250px;"><img src=${head.pathbr} height=200 width=270 style="padding:4px"/><h2>${head.product}</h2>

                             <p>${head.desc}</p>

                                

                             </div>

                             <hr>

   </div>

</div>

Adobe Experience Manager Help | Creating a HTL Repeating Data Set 6.3 Component that uses Sling Models

2 replies

anj8488Author
May 28, 2018

Hi Friends,

Is there anyway I can achieve this,

Thanks

Ankit

smacdonald2008
smacdonald2008Accepted solution
Level 10
May 28, 2018

Typically you are iterating over the Collection in a HTL front end,

<h2>Current Issue</h2>

<div

    data-sly-use.multiItems="com.htl.community.coral.core.models.Multifield">

    <div data-sly-list.head="${multiItems.products.listChildren}">

        <div style="height:250px;"><img src=${head.pathbr} height=200 width=270 style="padding:4px"/><h2>${head.product}</h2>

                             <p>${head.desc}</p>

                                

                             </div>

                             <hr>

   </div>

</div>

Adobe Experience Manager Help | Creating a HTL Repeating Data Set 6.3 Component that uses Sling Models