在日期选择器中禁用选定日期的日期

Question

我的 Laravel 应用程序中有一个在线预约表格，其中包含一些归档Select Doctor和datepicker.

假设医生A将在周六、周一和周三到诊所。医生B将在周日、周二、周四有空。A因此，当任何患者从现场选择医生时Select Doctor，日历中所有星期六、星期一和星期三的日期都将被激活datepicker，其他日期将被停用。

我已经停用了一些选定的datepicker日历日期。但不能禁用datepicker.

网页格式

<input class="form-control" id="appointment_datepicker" name="appointment_datepicker" type="text" placeholder="Select Date" value="{{ $user->appointment_datepicker or old('appointment_datepicker') }}">

阿贾克斯

    $.ajax({

      url:"{{ url('/filter_available_date') }}",

      type: 'GET',

      data: {_token :token, branch_id_appointment : branch_id_appointment, doctor_id_appointment : doctor_id_appointment},

      success:function(msg){

        $('#appointment_datepicker').datepicker('option', 'beforeShowDay', function(date){

                var day = jQuery.datepicker.formatDate('yy-mm-dd', date);

                return [ msg.indexOf(day) == -1 ] //here msg is the Array of selected Dates which are activated in the datepicker calendar

            });                    

    }

});

路线

Route::get('/filter_available_date','frontendAppointmentController@filter_available_date');

控制器

public function filter_available_date(Request $request)

{

    $branch_id = $request->branch_id_appointment;

    $doctor_id = $request->doctor_id_appointment;    

    $query =  DB::table('service_doctors');

    $query->select('doctor_id','inactive_dates_in_this_month');    

    if($branch_id != '0')

        $query->where('branch_id','=', $branch_id);

    if($doctor_id != NULL)

        $query->where('doctor_id','=', $doctor_id);

    $result_time = $query->get();    

    $result = [$result_time[0]->inactive_dates_in_this_month];    

    $final_result= explode(',',$result[0]);    

    return $final_result;

}

日历

如何解决这个问题？有人帮忙吗？提前致谢。

Answer 1

乍一看，这似乎是日期不匹配的问题。如果您使用下面的示例，您可以看到来自 API 的数据应该是什么样子。var msg = ["2020-05-11"];$('#appointment_datepicker').datepicker({&nbsp; beforeShowDay: function(date) {&nbsp; &nbsp; var day = jQuery.datepicker.formatDate('yy-mm-dd', date);&nbsp; &nbsp; return [msg.indexOf(day) == -1]&nbsp; }});<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.0/themes/smoothness/jquery-ui.css" /><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><script src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js" integrity="sha256-eGE6blurk5sHj+rmkfsGYeKyZx3M4bG+ZlFyA7Kns7E=" crossorigin="anonymous"></script><input class="form-control" id="appointment_datepicker" name="appointment_datepicker" type="text" placeholder="Select Date">

Answer 2

这里每天都有一个固定号码，例如Sunday = 0Monday = 1Tuesday = 2Wednesday = 3Thursday = 4Friday = 5Saturday = 6&nbsp;所以Array一天的数字（例如：var arr = [1, 2, 3];）从控制器返回，那一天将在datepicker.只需在 Ajax 中更改以下代码阿贾克斯var arr = [1, 2, 3] //these are the array of days numbers return from controller$('#appointment_datepicker').datepicker('option', 'beforeShowDay', function(date){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var day = date.getDay();&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return [(arr.indexOf(day) != -1)];&nbsp; &nbsp; });所以只在这里Monday，Tuesday并将Wednesday在日历中激活datepicker。