Filter Array (working sample)

by Bianca Kuehweidner

HTML

<div class="singlefare" id="fare0">

    <div class="segment__moreFlightTimes">
    
      <input type="radio" id="rb-fare0-leg0-c0" name="fare0-leg0" value="1" data-stopamountsegment="1" data-departuretimesegment="10:00" data-arrivaltimesegment="22:00">10:00-16:00<br/>
      <input type="radio" id="rb-fare0-leg0-c1" name="fare0-leg0" value="2" data-stopamountsegment="1" data-departuretimesegment="08:00" data-arrivaltimesegment="20:00">08:00-20:00<br/>
      <input type="radio" id="rb-fare0-leg0-c2" name="fare0-leg0" value="3" data-stopamountsegment="1" data-departuretimesegment="14:00" data-arrivaltimesegment="18:00" checked>14:00-18:00
    </div>

</div>

<hr/>

<div class="singlefare" id="fare1">

    <div class="segment__moreFlightTimes">
      FRA - JFK<br/>
      <input type="radio" id="rb-fare1-leg0-c0" name="fare1-leg0" value="1" data-stopamountsegment="1" data-departuretimesegment="10:00" data-arrivaltimesegment="16:00" checked>10:00-16:00<br/>
      <input type="radio" id="rb-fare1-leg0-c1" name="fare1-leg0" value="2" data-stopamountsegment="1" data-departuretimesegment="08:00" data-arrivaltimesegment="20:00">08:00-20:00<br/>
      <input type="radio" id="rb-fare1-leg0-c2" name="fare1-leg0" value="3" data-stopamountsegment="1" data-departuretimesegment="14:00" data-arrivaltimesegment="18:00">14:00-18:00
    </div>

</div>

JavaScript

const SegmentCount = 2;

/* Given values that are dynamic later and only used for a sample here */
let Segment = 0;
let MaxStops_per_Segment = "2";
let MaxStop_Duration_per_Segment = "24:00";
let DepartureTime_Min = "09:00";
let DepartureTime_Max= "16:00";
let ArrivalTime_Min = "10:00";
let ArrivalTime_Max= "20:00";


/* All Fare data */
let Fares = [];
let SingleFare = [];

GenerateFareArray();


function GenerateFareArray() {
      
    $(".singlefare .segment__moreFlightTimes input[type='radio']:checked").each(function() {
        
        let currentSegment = $(this).attr("name").split("-");
      
        SingleFare = { 
          FareID: $(this).closest(".singlefare").attr("id"), 
          Segment: currentSegment[1].slice(3,10), 
          StopAmount: $(this).data("stopamountsegment"),
          DepartureTime: $(this).data("departuretimesegment"), 
          ArrivalTime: $(this).data("arrivaltimesegment") 
        };  
                
        Fares.push(SingleFare);
   
        for (let i=0; i <= Object.keys(Fares).length; i++ ) {
           console.log(SingleFare.FareID + " / Segment " + SingleFare.Segment + ": " + SingleFare.DepartureTime + " - " + SingleFare.ArrivalTime);
        }
    
    });
    
    //NOW I NEED TO FILTER THE ARRAY SO THAT I GET THE NAMES (IDS) OF ALL MATCHING FARES
    //FILTER THE COLLECTED (CHECKED) FARES AGAINST THE GIVEN SEGEMENT AND TIME VALUES (ROW 4-8)
    
    FilterFares();
}
   
  

$(".segment__moreFlightTimes input[type='radio']").on("click", function() {
		Fares = [];	
    GenerateFareArray();
});



function FilterFares() {

	$(".singlefare").hide();
  
  var matchingFares = $.grep(Fares, function(e) {
    return e.Segment == Segment && e.StopAmount <= MaxStops_per_Segment && e.DepartureTime >= DepartureTime_Min && e.DepartureTime <= DepartureTime_Max && e.ArrivalTime >= ArrivalTime_Min && e.ArrivalTime <= ArrivalTime_Max;
	});

	console.log(matchingFares); 
  
  
  for(let f = 0; f<matchingFares.length; f++) {
 ...