Tuesday, October 25, 2016

SharePoint Client Side Rendering - Part 3

This post continuation to "Client Side Rendering - Part 2"

SharePoint Client Side Rendering , to understand from the basic, Just wanted to see how the default CSR template works on SharePoint List.

I have created the simple list with and checked the html source view in Chrome Browser.

Here its look like,

SharePoint 2013 Client Side Rendering (CSR - Learning from the basics)

And one more tips to understand how the SharePoint list being rendered using the CSR approach.

I have checked the Account list using the Chrome Browser and inspected the List and it their HTML elements. This has been designed with id "CSRSaveAsNewViewDivWPQ1", On rendering time this whole DIV will be transformed to new UI as like and tweaked in JavaScript.

Here is how its look like

SharePoint 2013 Client Rendering Template (Default)

Again, this default list's client side rendering's script on the "clienttemplates.js", in this CSRSaveAsNewViewDiv, a html link has been added using the JavaScript's array method.
Like wise, you can customise this CSRSaveAsNewViewDiv as your wishes.

In next part of Client Side Rendering, I show you how to customise the list and its look and feel in very simplest way.