I'm looking for a tutorial or documentation on how to create a JSLINK rendering template that will perform view grouping rendering. I need to use this in connection with the list view webpart, where I have configured its view to group items by a given field. Any assistance would be greatly appreciated.


I found the way to make it work:

overrideCtx.Templates.Group = CustomGroup;

function CustomGroup(ctx, group, groupId, listItem, listSchema, level, expand) {
    var html = '<div style="float:left">' + listItem[group] + ' : </div>';
    return html;
  • I tried this and it does modify the Grouping section, however, the issue I am having is that all of my Grouping sections are enlisted without the items that belong to them, and then all items are stacked below the groupings. Any ideas? – Boris Jan 28 '15 at 15:06
  • Seems that a workaround addressing this issue is being discussed here: sharepoint.stackexchange.com/questions/149622/… – DmytroL Feb 27 '16 at 18:05
  • Make sure you have selected the group to be shown expanded and not default collapsed – bonm014 Jun 30 '17 at 13:28

Martin Hatch has a series on how to use JSLink

The following items are or will be covered

  • Part 1 – Overview, URL Tokens and Applying JSLink to objects
  • Part 2 – Changing how individual fields display
  • Part 3 – Creating a custom editing interface
  • Part 4 – Validating user input
  • Part 5 – Creating custom List Views
  • Part 6 – Creating View Templates and Deployment Options
  • Part 7 – Code Samples

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.