1,105,221 Community Members

Problem with overlapping times in radio selections

Member Avatar
alpay.can.984
Newbie Poster
1 post since Sep 2013
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

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.

Question Self-Answered as of 6 Months Ago
Member Avatar
stbuchok
Posting Shark
957 posts since May 2011
Reputation Points: 123 [?]
Q&As Helped to Solve: 142 [?]
Skill Endorsements: 2 [?]
 
0
 

You can get the number of milliseconds since January 1st, 1970 for the starting and ending times and use those for comparisons.

So on each input radio button have a starting and ending attribute that you can use for comparison purposes.

For example,

Businesses - Wednesday October 30th 10:00am - 12:15pm

<input type="radio" data-start="1385823600000" data-end="1385831700000" />

You can now use simple greater than > and less than < comparisons to determine if there are overlapping ranges in the dates.

This will also allow extending it to more and more dates with very little work.

http://www.w3schools.com/jsref/jsref_obj_date.asp

You
This question has already been solved: Start a new discussion instead
Post:
Start New Discussion
Tags Related to this Article