<section id="main_form" class="padding12top"><!-- /.one way car listing start -->
    <div class="banner-bottom pcenter" >
        <!-- container -->
        <div class="container ">
            <?php echo $this->partial('outstation/index/round-trip-modify'); ?>
            <div class="banner-bottom-grids">

                <div class="row">

                    <div class="col-md-2  banner-bottom-grid widthpercent20 pull-left">

                        <!-- one-way-filters-by-left.phtml file will include here -->
                        <?php echo $this->partial('outstation/index/vehicle-filter'); ?>

                    </div>

                    <div class="currency-filter">

                    <div class="col-md-8 banner-bottom-grid widthpercent60 padding_margin0">

                        <div class="destinations-grid-info tours tours1 marginbot10">
                            <div class="mapcantiner_inner1 no-padding">
                                <div class="margin-bot10px padding-bot10px">
                                    <div class="col-md-2 sightmargin overviueimgcar" align="left"> Car Type </div>
                                    <div class="col-md-2 sightmargin overviueimg2car" align="left"> </div>
                                    <div class="col-md-2 sightmargin overviueimg2car1" align="left" > <span class="vehicle_name">Departure</span><br>
                                    </div>
                                    <div class="col-md-2 sightmargin overviueimg2" align="left"> <span class="vehicle_name">Arrival</span><br>
                                    </div>

                                    <div class="col-md-2 sightmargin overviueimg2car1 padding_margin0" align="left"> <span class="vehicle_name">Duration & Price</span><br>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="clearfix"> </div>

                        <!--    ACCORDIAN START-->

                        <div id="filtered-vehicle-data">
                            <?php echo $this->partial('outstation/index/round-trip-filtered-vehicle-listing'); ?>
                        </div>

                        <div id="accordion-guest" class="panel-group"></div>
                        <!--ACCORDIAN END-->
                    </div>
                    <!-- one-way-payment-right.phtml file will include here -->
                    <div class="col-md-2 banner-bottom-grid widthpercent20 pull-right">
                        <div class="top-destinations-grids margin0">
                            <?php echo $this->partial('outstation/index/round-trip-payment-detail'); ?>
                        </div>
                    </div>

                    </div>
                    <div class="clearfix"> </div>
                </div>
            </div>
        </div>
    </div>

</section><!-- /.one way car listing end -->
<script src="<?php echo $google_map_url; ?>?key=<?php echo $google_map_key; ?>&libraries=places" async defer></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>    
var $filterCheckboxes = $('input[type="checkbox"]');

$filterCheckboxes.on('change', function() {
  var selectedFilters = {};

  $filterCheckboxes.filter(':checked').each(function() {

    if (!selectedFilters.hasOwnProperty(this.name)) {
      selectedFilters[this.name] = [];
    }

    selectedFilters[this.name].push(this.value);

  });

  // create a collection containing all of the filterable elements
  var $filteredResults = $('.vehicle-filer-class');

  // loop over the selected filter name -> (array) values pairs
  $.each(selectedFilters, function(name, filterValues) {

    // filter each .flower element
    $filteredResults = $filteredResults.filter(function() {

      var matched = false,
        currentFilterValues = $(this).data('category').split(' ');

      // loop over each category value in the current .flower's data-category
      $.each(currentFilterValues, function(_, currentFilterValue) {
            //$('.vehicle-filer-class').find('.collapse').addClass('in');
        // if the current category exists in the selected filters array
        // set matched to true, and stop looping. as we're ORing in each
        // set of filters, we only need to match once

        if ($.inArray(currentFilterValue, filterValues) != -1) {
          matched = true;
          return false;
        }
      });

      // if matched is true the current .flower element is returned
      return matched;

    });
  });

  $('.vehicle-filer-class').hide().filter($filteredResults).show();

});
   
   
$('.vehicle-type').on('change', function() {
    if($(this).prop("checked")){ 
        $(this).parents(".supplier").find(".vehicle-name").removeClass("display-none");
    }else{     
        $(this).parents(".supplier").find(".vehicle-name").addClass("display-none");
    }
});   
   
</script>