Custom Field Rendering with JSLink

One of the Best feature to use in custom column rendering in sharepoint 2013.
JSLink is a property of a field. You can use this property to override how the field renders and how its value is set. In the example I have, I create a site column based on a Multiline text field. But when I set the JSLink property, I pretty much tell SharePoint “Hey, instead of rendering this field as a text box, use this JavaScript file to render the column.” With so much control, the possibilities are pretty much endless.
How we can implement.

View’ function to render the field if it is included in a list view. In this function you return html.
DisplayForm’ function to render the field when the user is viewing the properties of a list item. Also returns html.
EditForm’ function to render the field when the user is editing the properties of a list item. Returns html.
NewForm’ function to render the field when the user is adding a new list item. Again, should return html. Normally this would be the same as the ‘EditForm’ but it doesn’t have to be.
GetValueCallBack’ function to pass the field’s value to SharePoint after the user clicks
Submit. This one should return the value type of the field type. In my example, I’ll return
a string value.The first step is to determine how you want the user to enter data. In the EditForm and
NewForm functions, you’ll need to render the DOM elements to capture the data. This could be the cascading dropdowns or (in my example) several text boxes to capture sections of a single ingredient. You may also want to add JavaScript events to those elements.

Next determine how you want your value passed back to SharePoint. There are a few options to
handle this. One option is to render a hidden input element when you render your data
capture. Then handle events on the data capture elements (e.g. onchange). Within the event
handlers populate the hidden input field’s value. In the end, pass the hidden input’s value to SharePoint in the getValueCallBack function.

About Krishana Kumar

Krishana Kumar is SharePoint Architect/Trainer having Architecture experience with high volumes at Enterprise level and global scale - creation of highly scalable solutions with global user base and geographically distributed architectural components. Good knowledge of SharePoint best practices and governance models. I hold Two Master degree in Computer Science with over 11 years of experience working on Microsoft Technologies specially SharePoint, Project, .NET and other Information Worker Technologies. Having good exposer in Client side scripting Angular.js, backbone and Node. I am currently responsible for SharePoint Infrastructure set up and leading teams in various medium and large scale projects, architecting, designing & installing SharePoint farms, developing custom components,, and providing advanced SharePoint administration and development training to teams and customers. I regularly speaks in various SharePoint User Groups and other Events. I have MCSA Windows Azure, MCSA Office 365, MCSE & MCSD SharePoint 2013, Microsoft Certified Developer (MCD) and holds MCPD, MCTIP and MCTS for SharePoint 2010, MCTS MOSS 2007 & WSS 3.0, MCPD, MCITP (EPM 2010 & 2007) and MCSD .NET.
This entry was posted in General Interest. Bookmark the permalink.