I found a solution in the below post to hiding columns using JS link. However, I have multiple webparts on a page with different views of the same list and it is only hiding the columns in the first webpart. I want it to hide the columns in all webparts.

Any thoughts on why this doesn't work?

FWIW, I have other js in the same file to update display values in the same list (different columns) that is working across all webparts as expected.

Hide more than one list column with JSlink

OnPostRender: function(ctx) {
    ["col1", "col2"].forEach(function(name) {
        var header = document.querySelectorAll("[displayname=" + name + "]") 
        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";

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.