SharePoint 2013 Custom CSR Render Mode for NewForm (also for DispForm and ViewForm) renders input controls apart from labels

Question

For several weeks I am developing some features for my new projects on SharePoint 2013 using new technology called Client Side Rnedering (CSR). Until now there have been almost no issues except lack of documentation or lack of advanced examples.

Intention:

I want to customize New Form and also other forms (not fields and not views, but forms!) that are rendered in ListFormWebPart (not DataViewWebPart) so I can render fields in any manner I want, for example, add tabs, change layout, make several columns etc. I also want to use my already written JSLink Field Templates so Server Rendering and XSLT is not the way I am looking for.

If I use Standard CSR Render Mode, I can't override Template.Item, but it can be done while using Custom CSR Render Mode for Form's WebPart.

Problem:

Immediately after CSR Custom Render Mode is turned on (before adding any customizations), WebPart renders field input controls apart from these field labels and Form's table itself.

Why this is happening?

I have no problem writing my own rendering of Labels if I could get rid of those that SharePoint Renders OOB.

Is this some kind of a bug?

Any ideas?

Answer 1

It seems that the Custom mode was not really tested by MS. I've been digging into the Custom mode for several days, and I actually found a workaround, although I don't think it really pays off to use it.

You can find example of using this workaround to create a tabbed list form on CodePlex:

• CSRTabs.js - the main script that renders the layout
• Schema.xml - see the <Forms> tag
• Form.aspx - the form page

Here is the screenshot of the resulting form:

The main problem is that you have to employ a rather big amount of code to make it work. And even then, it doesn't work perfectly. I had to apply a rather ugly hotfix to recover Modified and Created info. And also using this method, you have to generate field labels manually.

Some advices of how you can change form layout in Standard mode can be found in this article (see "Example: manipulating form layout"):

• SharePoint 2013 Client Side Rendering: List Forms