0

I have a few list views on SharePoint 2013.

I want to set background color on the list view selector or set font color.

How to do it?

Thanks!

2
  • Which version of SharePoint you are using? Feb 27, 2019 at 17:01
  • Sharepoint 2013
    – JJL
    Feb 28, 2019 at 1:38

1 Answer 1

0

In SharePoint 2013 was introduced a so called Client Rendering Mode (CSR) which represents a rendering engine for list views, list forms and search results. I would recommend you to consider the following approach for your task.

Below example demonstrates how to highlight list task rows based on their status

Template code:

SP.SOD.executeFunc("clienttemplates.js", 
"SPClientTemplates", function() {
SPClientTemplates.TemplateManager.
RegisterTemplateOverrides({
     OnPostRender: function(ctx) {

       var statusColors =  {
      'Not Started' : '#FFF1AD',  
      'In Progress' : '#FFD800',
      'Completed' : '#01DF3A' 
   };

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

});

For more clarification and how to add this code in JSLink of list view, see my answer How to Highlight a Row on Active Status.

1
  • Have you tried this? Is it working for you?? Sep 9, 2019 at 7:20

Your Answer

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

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