List Column Highlight in Sharepoint 2013 for IE11 and Edge Browsers

Question

I used the code suggested in this previous post (List Column Highlight Sharepoint 2013), and it works fine in Chrome and firefox, however it does not seem to work in IE11 or Edge browsers. Is there something I need to add to the code below to allow the highlighted rows to show in IE11 and Edge as well?

<script type="text/javascript">
SP.SOD.executeFunc("/_layouts/15/clienttemplates.js", "SPClientTemplates", function() {

   SPClientTemplates.TemplateManager.RegisterTemplateOverrides({
     OnPostRender: function(ctx) {

       var statusColors =  {
          'Yes' : '#F3F31580' ,
          'No' : '#FFFFFF'
       };

       var rows = ctx.ListData.Row;
       for (var i=0;i<rows.length;i++)
       {
          var status = rows[i]["EventChangePending"];
          var rowId = GenerateIIDForListItem(ctx, rows[i]);
          var row = document.getElementById(rowId); 
          row.style.backgroundColor = statusColors[status];
       }
     }
   }); 

});
</script>

Thanks,

Albert

Answer 1

Your jslink code is fine. The problem is in the color notation that you are trying to set to the background of the row. Neither IE nor Edge support the notation with included opacity.

If you change this part 'Yes' : '#F3F31580' to this 'Yes' : '#F3F315' it should work fine.

Answer 2

Also, if you really want to specify opacity, you can use RGBA, which is supported by edge and IE (8+ I believe). In RGBA, your color would be "rgba(243, 243, 21, 0.5)"