Contents
When does the onpostrender event fire in jslink?
The function OnPostRender event fires after the DOM is loaded. Note: One thing, needs to be remembered that before calling the function JSLinkSecurity.Functions.ChangeFieldColor, we need to define it, otherwise, it will not work in JSLink.
When to use onpostrender to change font color?
OnPostRender accepts either a function or an array of them. All provided functions will be executed whenever an event is fired. In the above function, we are trying to change the FONT COLOR of FirstName field. For this, we are using:
Edit Current Page. Selected edit web part for View form. Go to Miscellaneous > JS Link property. Add the reference to JSLink file: If you have placed your JS inside SiteAssets library of some CHILD site, you should use ~site/SiteAssets/ URL.
How to change first name field in jslink?
If present, then change the color of the text to RED for which CSS class ‘csrColor’ present after the rendering of the page. Then the user will be able to see red color of text for FirstName field. After that we need to call the custom function on JSLink > OnPostRender Event and need to override the view of FirstName field:
What’s the difference between CSR and jslink in JavaScript?
CSR is a technique that is used to customise the look and feel of lists and libraries on the client side (via JavaScript), and JSLink is simply a method of pointing a list/library view/form to a JavaScript file. I agree with the previous answers !
JSLinkSecurity.Functions.OverRideFNameField: This function override the view template of FirstName and will add one custom class ‘csrColor’ and render the FirstName field value inside the span. JSLinkSecurity.Functions.ChangeFieldColor: This function checks the ‘csrColor’ CSS class present on the page or not.
Client-side rendering or JSLink is a new concept in SharePoint 2013. In my earlier article SharePoint2013: JSLink (Client Side Rendering) explained about Client-side rendering or JSLink. In this article, we are going to use JSLink > OnPostRender Event.