如何将Javascript应用于分组的SharePoint列表？

Question

I am fairly new to the SharePoint customization scene but have picked up some javascript which will change the background colour of a cell in a SP list dependent on the value of the cell.

This works fine on normal views but anything that is grouped doesn't work which i beleive is something to do with the order the page loads. Is there a way to apply javascript to a view that is grouped and set to collapsed as default?

I have seen another thread from last year with a similar query but there doesn't appear to be a resolution to it.

Many Thanks in Advance!!!

Dan

This is the code that im using for the cell colour change:

<script type="text/javascript" language="javascript">   
  var x = document.getElementsByTagName("TD") // find all of the TDs
  var i=0;
  for (i=0;i<x.length;i++)
  {
 if (x[i].className=="ms-vb2") //find the TDs styled for lists
  { 

if (x[i].innerHTML=="Green" && x[i].cellIndex==10)
  {
    x[i].style.backgroundColor='forestgreen'; // set the background color
    x[i].style.color='Black'; //set the font color
  }

if (x[i].innerHTML=="Amber" && x[i].cellIndex==10)
  {
    x[i].style.backgroundColor='Goldenrod'; // set the background color
    x[i].style.color='Black'; //set the font color
  }

if (x[i].innerHTML=="Red" && x[i].cellIndex==10)
  {
    x[i].style.backgroundColor='Firebrick'; // set the background color
    x[i].style.color='black'; //set the font color
  }
 }
}
</script>

Answer 1

Maybe in your case it would be much easier to customize the CSS style for the given column. You can define a new CSS rule extending the ms-vb2 class but only applies to 10th column. Use a CSS selector can easily achieve this.

For instance, locate the CSS style sheet with applies to this cell, and define a new rule: .ms-vb2:nth-child(10)[innelHtml='Red']{ Background-color:firebrick; Color:black }

Then whenever your table cell is visible, the CSS will apply.