We have this code, thanks to a helpful person but it does not fully work as expected. The problem is that it currently checks for an exact match of dates, but there are situations of times that overlap one another and that should show a conflict too (background becomes red in case of conflicts). As you can see the following date "Wednesday Oct/30 11:00 AM - 3:15 PM" of Engineering overlaps with both Wednesday Oct/30 10:00 AM - 12:15 PM of Business and Reliability. Obviously one cannot be at the same time at different locations.
The code used is this:
$(".time").change(function() {
var values = $("input.time").map(function(){
return $(this).val();
});
values.each( function (){
var overlapping = $("input.time[value='"+ this +"']");
if (overlapping.filter(":checked").length > 1){
overlapping.parents("tr").addClass("red");}
else{
overlapping.parents("tr").removeClass("red");
}
})
});
The fiddle is here: http://jsfiddle.net/3VFRt/
I know what needs to be done but I can't seem to grasp how that is done in jQuery. I am thinking it needs to extract the date data from the columns (td's) and see if there is an overlap in time, if so show it accordingly (css class=red). Basically the script needs some refining and it will work perfectly. If anyone can help me out here I would be very grateful. Thanks in advance.
