Question

更改日期时，我试图发送ajax请求以从控制器中获取数据。我无法正确编写Ajax代码。我的代码如下：

{!!Form::open(['action' => 'BookingsController@store', 'method' => 'POST'])!!}
   @csrf


  <input type="date" name="eventDate" id="eventDate" value="">


  <select name="vehicleName" id="vehicleName">
       <option disabled selected>Choose Vehicle...</option>
  <?php foreach ($availableVehicles as $key => $vehicle): ?>
     <option id="{{$vehicle->id}}">{{$vehicle->name}} </option>
   <?php endforeach; ?>
  </select>

 {!!Form::close()!!}

$(document).ready(function(){
  $(#eventDate).change(function(){
      var eventDate = $(this).val();
 
      $.ajax({
        url:"{{ route('booking.create') }}",
        method:"GET",
        data:{eventDate},
        success:function(result){
          $('#vehicleName').val('');
        }
      });
  });
});

Answer 1

1）您需要将令牌变量token添加到数据属性中。因为Laravel为应用程序管理的每个活动用户会话自动生成CSRF“令牌”。该令牌用于验证经过身份验证的用户是实际向应用程序发出请求的用户。

data{'_token': '{{ csrf_token() }}'},

2）您忘了在#eventDate函数中添加引号。更改此：

$(#eventDate).change(function(){

对此

$('#eventDate').change(function(){

3）我的想法是在.change()函数内部创建ajax。这是下面的完整代码：

$(document).ready(function(){
  $('#eventDate').change(function(){
     var eventDate = $(this).val();

     $.ajax({
        url:"{{ route('booking.create') }}",
        method:"GET",
        data:{'_token': '{{ csrf_token() }}','eventDate' : eventDate },
        success:function(result){
            $('#vehicleName').val('');
        },
     });
  });
});

我希望它对您有帮助

Answer 2

为避免提交表单，您应该添加：

$(document).ready(function(){
  $("#form" ).submit(function( event ) {
    // to track it is working: console.log( "Handler for .submit() called." );
    event.preventDefault();
  });
});

如何在Laravel中更正此Ajax请求

2 个答案: