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. Jun 12, 2020 at 19:57

1 Answer 1

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. Jun 24, 2020 at 18:34

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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