I would like to learn how to completely override a list's view and recreate it using JSLink, if such a thing is possible. There appears to be a huge gap between the types of alterations I can make: "alter the content but the layout is unchanged" or "change the layout but lose OTB functionality", an example of this would be the sort ability on the column labels.

The steps I want to be able to go through are:

  1. Take a list and note it's layout.
  2. Using JSLink completely blank the layout.
  3. Using Overrides only, recreate the layout in Step 1; meaning that through JavaScript I recreate:
    • The Header.
    • Each Column label.
    • Each Column label's functionality, such as sort and filtering.
    • The data displayed in each field.
  • Break up your question into separate chunks, you are now asking for a complete solution. Not many will even read and try to understand what you are asking for. Dec 2 '15 at 12:20

You could dig through clienttemplates.debug.js to see how SP does it. Also, you could set up a simple override, set a breakpoint, and explore what the ctx object has to offer. A lot of the internal/default rendering methods are exposed and usable, like

ctx.RenderFieldByName(ctx, "fieldName");

And others as well.

And check out some of these other questions on this site that talk about getting the default rendering inside override code:

Sharepoint 2013 JS Link return default field rendering

In SP Online, how to return the default HTML of a lookup field when overriding the Item Template in a list view

Using JSLink to manage and output list groups and items

  • This was very helpful. It looks like the exact programing style I wanted to use isn't actually do-able with the API but at the end of the day, I made the stake-holder happy.
    – amsackett
    Dec 7 '15 at 20:39
  • I'm getting "RangeError: Maximum call stack size exceeded" when trying to override the DocIcon column using: ctx.RenderFieldByName(ctx, "DocIcon")
    – Batman
    Oct 2 '17 at 16:52

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.