Sharepoint - Sharepoint 2013 JS Link return default field rendering
'Text': {
'View': RenderFieldValueDefault,
'DisplayForm': SPField_FormDisplay_Default,
'EditForm': SPFieldText_Edit,
'NewForm': SPFieldText_Edit
},
'Number': {
'View': RenderFieldValueDefault,
'DisplayForm': SPField_FormDisplay_Default,
'EditForm': SPFieldNumber_Edit,
'NewForm': SPFieldNumber_Edit
},
'Integer': {
'View': RenderFieldValueDefault,
'DisplayForm': SPField_FormDisplay_Default,
'EditForm': SPFieldNumber_Edit,
'NewForm': SPFieldNumber_Edit
},
'Boolean': {
'View': RenderFieldValueDefault,
'DisplayForm': SPField_FormDisplay_DefaultNoEncode,
'EditForm': SPFieldBoolean_Edit,
'NewForm': SPFieldBoolean_Edit
},
'Note': {
'View': RenderFieldValueDefault,
'DisplayForm': SPFieldNote_Display,
'EditForm': SPFieldNote_Edit,
'NewForm': SPFieldNote_Edit
},
'Currency': {
'View': RenderFieldValueDefault,
'DisplayForm': SPField_FormDisplay_Default,
'EditForm': SPFieldNumber_Edit,
'NewForm': SPFieldNumber_Edit
},
'File': {
'View': RenderFieldValueDefault,
'DisplayForm': SPFieldFile_Display,
'EditForm': SPFieldFile_Edit,
'NewForm': SPFieldFile_Edit
},
'Calculated': {
'View': RenderFieldValueDefault,
'DisplayForm': SPField_FormDisplay_Default,
'EditForm': SPField_FormDisplay_Empty,
'NewForm': SPField_FormDisplay_Empty
},
'Choice': {
'View': RenderFieldValueDefault,
'DisplayForm': SPField_FormDisplay_Default,
'EditForm': SPFieldChoice_Edit,
'NewForm': SPFieldChoice_Edit
},
'MultiChoice': {
'View': RenderFieldValueDefault,
'DisplayForm': SPField_FormDisplay_Default,
'EditForm': SPFieldMultiChoice_Edit,
'NewForm': SPFieldMultiChoice_Edit
},
'Lookup': {
'View': RenderFieldValueDefault,
'DisplayForm': SPFieldLookup_Display,
'EditForm': SPFieldLookup_Edit,
'NewForm': SPFieldLookup_Edit
},
'LookupMulti': {
'View': RenderFieldValueDefault,
'DisplayForm': SPFieldLookup_Display,
'EditForm': SPFieldLookup_Edit,
'NewForm': SPFieldLookup_Edit
},
'Computed': {
'View': RenderFieldValueDefault,
'DisplayForm': SPField_FormDisplay_Default,
'EditForm': SPField_FormDisplay_Default,
'NewForm': SPField_FormDisplay_Default
},
'URL': {
'View': RenderFieldValueDefault,
'DisplayForm': SPFieldUrl_Display,
'EditForm': SPFieldUrl_Edit,
'NewForm': SPFieldUrl_Edit
},
'User': {
'View': RenderFieldValueDefault,
'DisplayForm': SPFieldUser_Display,
'EditForm': SPClientPeoplePickerCSRTemplate,
'NewForm': SPClientPeoplePickerCSRTemplate
},
'UserMulti': {
'View': RenderFieldValueDefault,
'DisplayForm': SPFieldUserMulti_Display,
'EditForm': SPClientPeoplePickerCSRTemplate,
'NewForm': SPClientPeoplePickerCSRTemplate
},
'DateTime': {
'View': RenderFieldValueDefault,
'DisplayForm': SPFieldDateTime_Display,
'EditForm': SPFieldDateTime_Edit,
'NewForm': SPFieldDateTime_Edit
},
'Attachments': {
'View': RenderFieldValueDefault,
'DisplayForm': SPFieldAttachments_Default,
'EditForm': SPFieldAttachments_Default,
'NewForm': SPFieldAttachments_Default
}
The following templates define how User field is rendered in List Form pages.
Single-valued user field:
New
:SPClientPeoplePickerCSRTemplate
Edit
:SPClientPeoplePickerCSRTemplate
Display
:SPFieldUser_Display
Multi-valued user field:
New
:SPClientPeoplePickerCSRTemplate
Edit
:SPClientPeoplePickerCSRTemplate
Display
:SPFieldUserMulti_Display
JavaScript Template
Assume a Tasks
list that contains a Task Category
field. Depending whether the value is set to Internal
or not, AssignedTo
field have to be rendered as a standard editable or ReadOnly
control. The following example demonstrates how to achieve that:
(function () {
var ctx = {};
ctx.Templates = {};
ctx.Templates.Fields = {
'AssignedTo': {
'EditForm': renderAssignedTo
}
};
SPClientTemplates.TemplateManager.RegisterTemplateOverrides(ctx);
})();
function renderAssignedTo(ctx) {
var readOnly = (ctx.CurrentItem.TaskCategory == "1;#Internal");
if(readOnly) {
prepareUserFieldValue(ctx);
return SPFieldUserMulti_Display(ctx);
}
return SPClientPeoplePickerCSRTemplate(ctx);
}
function prepareUserFieldValue(ctx) {
var item = ctx['CurrentItem'];
var userField = item[ctx.CurrentFieldSchema.Name];
var fieldValue = "";
for (var i = 0; i < userField.length; i++) {
fieldValue += userField[i].EntityData.SPUserID + SPClientTemplates.Utility.UserLookupDelimitString + userField[i].DisplayText;
if ((i + 1) != userField.length) {
fieldValue += SPClientTemplates.Utility.UserLookupDelimitString
}
}
ctx["CurrentFieldValue"] = fieldValue;
}
Results
Fig. 1 Task Edit Form page with default AssignedTo
field
Fig. 2 Task Edit Form page with read-only AssignedTo
field
If you look in the clienttemplates.debug.js file you'll see what SharePoint does internally to render fields. It has a "map" class that maps the field.FieldType (or field.Type) to the appropriate field renderer function. You can copy that map into your own function and get back the right renderer for any occasion:
// Returns the HTML that would have been rendered for a field if no custom rendering template were applied.
function getDefaultFieldHtml(renderCtx, field, listItem, listSchema) {
var renderingTemplateToUse = null;
var fieldRenderMap = {
Computed: new ComputedFieldRenderer(field.Name),
Attachments: new AttachmentFieldRenderer(field.Name),
User: new UserFieldRenderer(field.Name),
UserMulti: new UserFieldRenderer(field.Name),
URL: new UrlFieldRenderer(field.Name),
Note: new NoteFieldRenderer(field.Name),
Recurrence: new RecurrenceFieldRenderer(field.Name),
CrossProjectLink: new ProjectLinkFieldRenderer(field.Name),
AllDayEvent: new AllDayEventFieldRenderer(field.Name),
Number: new NumberFieldRenderer(field.Name),
BusinessData: new BusinessDataFieldRenderer(field.Name),
Currency: new NumberFieldRenderer(field.Name),
DateTime: new DateTimeFieldRenderer(field.Name),
Text: new TextFieldRenderer(field.Name),
Lookup: new LookupFieldRenderer(field.Name),
LookupMulti: new LookupFieldRenderer(field.Name),
WorkflowStatus: new RawFieldRenderer(field.Name)
};
if (field.XSLRender == '1') {
renderingTemplateToUse = new RawFieldRenderer(field.Name);
}
else {
renderingTemplateToUse = fieldRenderMap[field.FieldType];
if (renderingTemplateToUse == null)
renderingTemplateToUse = fieldRenderMap[field.Type];
}
if (renderingTemplateToUse == null)
renderingTemplateToUse = new FieldRenderer(field.Name);
return renderingTemplateToUse.RenderField(renderCtx, field, listItem, listSchema);
}
Then to get the default HTML that would have been rendered, just call it like this:
if (isReadOnly) {
// Do your thing
} else {
return getDefaultFieldHtml(ctx, field, listItem, listSchema);
}