List Library Alternate Row Background Color

Forms SharePoint Online
#1

How can I change the background color for alternating rows for a List or Library Control?

#2

Hello @sphilson,

You can change the color of alternating rows using this CSS:

.fd-sp-datatable-wrapper table tr.k-alt
{ background-color: white; }
1 Like
#3

@mnikitina Hi, can i change color by rows on condition by column?

for example Column Status(Finished, In Progress etc)
rows 1,2,3 - background red,
4,5,6 - another color white,
I have datatable, not list library control
and sharepoint 2019 , not online

#4

Hello @ixxxl,

You can change the row color based on the column value using this code:

var table = fd.control('DataTable1');
var value = table.value;
var row = $(table.$el).find('tr');

if(value){
	for (var i = 0; i < value.length; i++){
		if(value[i].Column1 == 'In Progress' ) {
			//sets the background color of the row to red
			$(row[i+1]).attr("style","background-color:red"); 
		}
	}
}
1 Like
#5

@mnikitina
Thank you !

1 Like