我们如何为多个jquery ui datepicker添加多种颜色？

Question

我在laravel有一个项目。在一个页面上我有几个jQuery ui datepicker，见下图。当页面加载时，我需要从数据库中获取一些日期，并根据数据在日历上标记一些颜色。目前我只能在一个日期选择器上标记颜色。如何在多个日期选择器上标记颜色？

CalendarController.php

return view('searchResult',['greenDates' => $available_dates, 'orangeDates' => $orangeDates, 'redDates' => $not_available_dates]);

searchResult.blade.php

@foreach($cabinSearchResult as $result)
        <div class="form-group row calendar" data-id="{{ $result->_id }}">

            <div class="col-sm-4">
                 <input type="text" class="form-control dateFrom" id="dateFrom_{{ $result->_id }}" name="dateFrom" placeholder="Arrival" readonly>
            </div>
            <div class="col-sm-4">
                 <input type="text" class="form-control dateTo" id="dateTo_{{ $result->_id }}" name="dateTo" placeholder="Departure" readonly>
            </div>

        </div>
@endforeach


@push('scripts')

    var greenDates      = {!! json_encode($greenDates) !!};
    var orangeDates     = {!! json_encode($orangeDates) !!};
    var redDates        = {!! json_encode($redDates) !!};
    var start_date      = '';

    $(".dateFrom").datepicker({
      showAnim: "drop",
      dateFormat: "dd.mm.y",
      changeMonth: true,
      changeYear: true,
      minDate: '+1d',
       yearRange: "0:+2"
    });

    $("body").on('mousedown', ".dateFrom", function() {

    var dataId       = $(this).parent().parent().data("id");
    var $this        = $(this);
    var returnResult = [];

    $this.datepicker("option", "beforeShowDay", function(date) {
       var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
       if( greenDates.indexOf(string) >=0 ) {
           returnResult = [true, "greenDates", "Available"];
       }

       if( orangeDates.indexOf(string) >=0 ) {
           returnResult = [true, "orangeDates", "Few are available"];
       }

       if( redDates.indexOf(string) >=0 ) {
           returnResult = [true, "redDates", "Not available"];
       }

       return returnResult;
    });

    $this.datepicker("show");

    });

@endpush