Question

I have a share point calender and i want to color code difrent blocks depending on what reg number they contain (its for a school’s minibuses)

How do i set the background color of .ms-cal-eworkday if a.ms-cal-tweekitem contains “EF04 WTR”

I need to do this in js/jquery as i don’t have the abity to edit the aspx (council politics)

Each entry looks like this.

<td class="ms-cal-eworkday" rowspan="6"> 
    <table cellpadding="0" cellspacing="0" border="0" class="ms-cal-tweekitem" dir="">
    <tbody><tr>
        <td valign="top" href="/schools/ecclesfield/newdemosite/minibus-booking/Lists/Minibus/DispForm.aspx?ID=3" onclick="GoToLink(this);return false;" target="_self">
         <div>
          <img src="/_layouts/images/blank.gif" width="50" height="1" alt=""><br>
          <img src="/_layouts/images/recursml.gif" class="ms-cal-hidden" alt="" align="absmiddle">
          <a onfocus="OnLink(this)" class="ms-cal-dayitem" href="/schools/ecclesfield/newdemosite/minibus-booking/Lists/Minibus/DispForm.aspx?ID=3" onclick="GoToLink(this);return false;" target="_self" tabindex="5">
            <nobr>03:00 PM</nobr>
            <br>
            <b>test2</b>
            <br>
            EF04 WTR
            </a>
         </div>
         </td>
     </tr>
     </tbody></table>

</td>

I know the code is a bit of mess that’s just how sharepoint works 🙁

Thanks in advance.

Lewis

Answer 1

Well one way is too loop through the table and check each cell.

$(function(){
    $('.ms-cal-dayitem').each(function(){
        if( $(this).text().indexOf("EF04 WTR") != -1 ) {
            $(this).closest('.ms-cal-eworkday').css("background-color","blue");
        }
    });
});