使用Ajax和Laravel保存数据

I just have an input form that I want to save to my database using Ajax, PHP and Laravel this code works fine to my other modules. But I can't just find the error why this code not working fine. Help me to spot what's wrong with my code. The Route is correct, my controller seems correct too but I really doubt my ajax if it's correct.

HTML:

  <input id="schedDate" name = "schedDate" type="text" class="datetimepicker-input form__field" placeholder="Schedule Date" data-target="#schedDate" data-toggle="datetimepicker">

  <input id="timeIn" name = "timeIn" type="text" class="datetimepicker-input form__field" placeholder="Time In" data-target="#timeIn" data-toggle="datetimepicker">

  <input id="timeOut" name = "timeOut" type="text" class="datetimepicker-input form__field" placeholder="Time Out" data-target="#timeOut" data-toggle="datetimepicker">

   <select id="cmbShift" name = "cmbShift" class="form__field" placeholder="Shift Type">
       <option value="">- Select Shift -</option>
       <option value="Pre-Shift">Pre-Shift</option>
       <option value="Post-Shift">Post-Shift</option>
   </select>

    <textarea type="text" id="txtReason" name = "txtReason" class="form__field" placeholder="Reason"></textarea>
    <input id="btnApplyAlter" name="btnApplyAlter" class="btnApplyAlter btn btn-sm button blue pull-right" type="button" value="Apply Overtime" style="width:220px;"/>

Here's my Ajax:

$(document).on("click", ".btnApplyAlter", function(){

var c = confirm("Apply this Overtime?");
var schedDate = $("#schedDate").val();
var timeIn = $("#timeIn").val();
var timeOut = $("#timeOut").val();
var cmbShift = $("#cmbShift").val();
var txtReason = $("#txtReason").val();

if(c == true)
{
    $.ajax({
        headers:{'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
        url: "{{ route('saveovertime') }}",
        method: "POST",
        data: {sched_date:schedDate,time_in:timeIn,time_out:timeOut,cmbShift:cmbShift,txtReason:txtReason}, 
        dataType: "json",
        success:function(data)
        {
            alert(data);
            refresh_Table();
        },
        error: function(xhr, ajaxOptions, thrownError){
            console.log(thrownError + "
" + xhr.statusText + "
" + xhr.responseText);
        }
    }); 
}
 });

Here's my Controller:

    public function save_overtime(Request $request){
    //Code for getting the current date of Asia/Manila
    date_default_timezone_set('Asia/Manila');
    $todays_date = date("Y-m-d H:i:s");
    $today = strtotime($todays_date);
    $todayDate = date("Y-m-d H:i:s", $today); 
    //Code for getting the current date of Asia/Manila

    $apply_overtime = new OvertimeRecords;
    $apply_overtime->company_id = auth()->user()->company_id;
    $apply_overtime->date_applied = $todayDate;
    $apply_overtime->sched_date = $request->sched_date;
    $apply_overtime->shift_applied = $request->cmbShift;
    $apply_overtime->date_timein = $request->time_in;
    $apply_overtime->date_timeout = $request->time_out;
    $apply_overtime->reason = $request->txtReason;
    $apply_overtime->lu_by = auth()->user()->name; 
    $apply_overtime->save();
    $message = "Overtime Applied Succesfully!"; 
    echo json_encode($message);
}

and here's my route:

 Route::post('overtimerecords/saveovertime', 'UsersController\\OvertimeRecordsController@save_overtime')->name('saveovertime');

Error:

and this error highlighted straight to ajax