I need to keep the columns enabled in all views, but I want to hide them from being displayed.

I'm using Cisar to inject .js

I found this: Hide more than one list column with JSlink (not working for me or I'm not implementing it correctly)

and this:

(function () {

function RemoveFields(ctx) {
    var fieldName = "Date"; // here Date is field or column name to be hide
    var header = document.querySelectorAll("[displayname=" + fieldName + "]")[0].parentNode;
    var index = [].slice.call(header.parentNode.children).indexOf(header) + 1;
    header.style.display = "none";
    for (var i = 0, cells = document.querySelectorAll("td:nth-child(" + index + ")"); i < cells.length; i++) {
        cells[i].style.display = "none";

function registerRenderer() {
    var ctxForm = {};
    ctxForm.Templates = {};
    ctxForm.OnPostRender = RemoveFields;
ExecuteOrDelayUntilScriptLoaded(registerRenderer, 'clienttemplates.js');


This one works, but only for one column. I need to inject this in separate .js files for each column.

I'm sure there's way to apply this code for several columns in one .js file, but I'm not sure how.

This code does not work when columns have two words in their name, even when the internal name is used.

Any other ideas welcome.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.