I would like to use CSR to customise a list display form.

I would like to change the order in which the columns are displayed and the layout of the form overall itself.

Playing around I notice that when I change the "CSR Render Mode" for a display form web part to "Custom (CSRCustomLayout)" the Header and Footer events fire, but then the form seems to output the labels (with no data next to them) and then then dumps all the data after the labels.

Also the pre and post render methods also do not fire unless it is in Custom layout mode.  Putting it back to Standard only runs the field level override.

What is the correct way to go about this? 

Code Used:

(function () {
 
    // Create object that have the context information about the field that we want to change it's output render 
    var dispContext = {};
    dispContext.Templates = {};
   
dispContext.Templates.Item = function (ctx)
{

 var title = ctx.CurrentItem["Title"];
 var description = ctx.CurrentItem["Description "];  
    return "<h2>" + title + "</h2><br/><p>description</p>";
}
   
    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(dispContext);
 
})();

Please help. What I wanted all is to remove the created by, modified information and to change the column display name and the layout of the view.

• Edited by ashiqf 12 minutes ago