Good day all,

I have been trying to wrap my head around SharePoint CSR. I have been fairly successful with using javascript to modify the list view. However, I have been trying to use the following code to hide a column which just doesn't work. The rest of the rendering logic works fine but the JQuery part of the code doesn't seem to work. Please help!

(function () {
//Create override object.
var overrideCtx = {};
overrideCtx.Templates = {};
overrideCtx.OnPostRender = [


function highlightDeliveredItem (inCtx) {
    //Rendering logic.
    for (var i = 0; i < inCtx.ListData.Row.length; i++) {
        var listItem = inCtx.ListData.Row[i];
        var iid = GenerateIIDForListItem(inCtx, listItem);
        var row = document.getElementById(iid);

        if (listItem.Status_x0020_Complete == 'No') {
            if (row != null) {
                row.style.backgroundColor = "rgb(50, 205, 50)";
        }else {
            if (i%2 != 0) {
                row.style.backgroundColor = "rgb(220,220,220)";
        var cell = $("div [name='Status_x0200_Complete']").closest('th'); 
        var cellIndex = cell[0].cellIndex + 1; 

        $('td:nth-child(' + cellIndex + ')').hide(); 
        $('th:nth-child(' + cellIndex + ')').hide(); 
    inCtx.skipNextAnimation = true;

1 Answer 1


Make sure the jQuery library is loaded as it is not automatically available on native MasterPages.

Also, you might want to execute your code within a $(document).ready event to make sure the objects you are selecting are available.

  • Hi Lucas, Thanks very much for your answer. You were right. I had not loaded the JQuery library.
    – kovac
    Oct 26, 2015 at 5:43

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.