Cannot Get JSLink to render on Custom List

Question

I'm having difficult rendering my JSLink file on a Custom List. My code looks to be fine from debugging, and I don't see any immediate issues if I include the code in a Script Editor, but my changes still aren't being applied. There are some weird issues going on in this site collection with custom lists in general; I can't tell if there's something inherently wrong/corrupt with this List Template Type or if it is my code.

Please advise.

Code included in .js file:

(function(){

var itemCtx = {};
itemCtx.Templates = {};

itemCtx.Templates.Header = "<div id='container'><table><tr><td>Project Category</td><td>Project</td><td>Project Summary</td><td>Toolkit Compliance</td><td>Project Lead</td></tr>";
itemCtx.Templates.Item = ItemOverride;
itemCtx.Templates.Footer = "</table></div>";

itemCtx.BaseViewID = 1;
itemCtx.ListTemplateType = 100;

SPClientTemplates.TemplateManager.RegisterTemplateOverrides(itemCtx);

})();

function ItemOverride(ctx) {

    var projCat = ctx.CurrentItem.projCat;
    var projSum = ctx.CurrentItem.Summary;
    var project = ctx.CurrentItem.Project;
    var projLead = ctx.CurrentItem.projLead;
    var projComp = ctx.CurrentItem.artCompliance;
    var html = "<tr class='content'><td><div id='projCat'>" + projCat + "</div></td><td>" + project + "</td><td>" + projSum + "</td><td>" + projComp + "</td><td>" + projLead + "</td></tr>";

        if (projCat == "Change Mangement") {
            $("div#projCat").addClass("cm");
        }

        else if (projCat == "Communications") {
            $("div#projCat").addClass("comms");
        }

        else if (projCat == "Modernization") {
            $("div#projCat").addClass("mod");
        }

        else if (projCat == "OBPI Support") {
            $("div#projCat").addClass("obpi");
        }


        else if (projCat == "Process Improvement") {
            $("div#projCat").addClass("pi");
        }

        else (projCat == "Project Management Standardization"){
            $("div#projCat").addClass ("pms");
        }
    return html;

}

The JSLink file was uploaded directly to the Masterpages Gallery as a Display Template Code. (There was not an option for JavaScript Display Template). And I copied and pasted an absolute URL versus a relative one for now.

*Also, two of the fields are lookup columns if that makes any difference.

Answer 1

Please make sure you are using the ~sitecollection URL token in your JSLink URL. In your case the URL should be ~sitecollection/_catalogs/.... Also, please make sure you check in, publish and approve your JS template file so that end users would be able to see the effect.