0

I have a SharePoint Online list that includes a title, URL, and a category. My category options are "Forms" and "Tools".

I want a HandleBars template that will loop through this list and group by category.

My Code:

<ul>
{{#each items}}
<li> <a href="{{URL.textValue}}">{{Category.textValue}} - {{Title.textValue}}</a> </li>
{{/each}}
</ul>

Here is what I get for results:

Forms & Tools

  • Forms - Employee Form
  • Forms - Customer Form
  • Tools - Order Sets
  • Tools - Self Service
  • Tools - Time Tracking

What I want to get is this:

Forms

  • Employee Form
  • Customer Form

Tools

  • Order Sets
  • Self Service
  • Time Tracking

I have tried doing a loop inside of a loop using {{#each items}}, but could not get this to work.

How can I do the looping so that it goes through my list and identifies the Categories, and groups the URL/Titles underneath each category?

1
  • I have gone the path of creating multiple web parts to accomplish the division of "Forms" and "Tools", using the filters in the web part properties, but would like to see this done within a single web part if possible that cycles through all of the "Categories and groups the links underneath them. – Gregg Machel Jun 12 '20 at 19:57
0

You should clean up the items array before passing it to the handlebars template first. Currently the items array holds all of the items in all categories. Better to pass a context object with 2 array properties, FormsItems and ToolsItems. Otherwise, if you do it in handlebars template itself, you will have to register a custom helper, that would check the value of the cateogry (Forms let's say) against the current item you're looping on, which means you will have to loop through the items twice, once per each category.

Imagine if you have 10 categories later, you will then have to loop through each category, and check the items in each category once again if they match that category.

So best thing is to clean the context object before you pass the values, and don't do too much logic inside the handlebars template itself.

1
  • Thank you, will dive into this. – Gregg Machel Jun 24 '20 at 18:34

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.