laravel表单序列化和文件上传

Question

嗨，我不明白为什么在我的形式序列化不能工作。我使用ajax上传文件。

我的剑是

  <form class="form-inline" id="uploadFileFrm">
     @csrf
     <select class="form-control ml-4" id="tas" name="tas">
      <option value="" disabled selected>Seleziona tas</option>
      @isset($users)
       @foreach ($users as $user)
        <option value="{{ $user->id }}">
         {{ $user->code }} - {{ $user->name }}</option>
       @endforeach
      @endisset
     </select>

     <div class="custom-file col-6 ml-4">
      <input type="file" class="custom-file-input form-control" id="fileToUpload" name="fileToUpload">
      <label class="custom-file-label" for="customFile"></label>
      <small id="fileHelp" class="form-text text-muted">Carica il planning selezionando prima il tas</small>
     </div>

     <button type="submit" class="btn btn-primary ml-4" id="importFile">Sign in</button>
    </form>

那么我的javascript是

  $(document).on("click", '#importFile', function(e) {
   e.preventDefault();
   var data = $('#uploadFileFrm').serialize();
   $.ajax({
    type: 'POST',
     cache: false,
     contentType: false,
     processData: false,
     url: "{{ url('/uploadfile') }}",
     data: data,
     success: function(data) {
      .........
     }
    }); //fine ajax
   });

它只序列化Chrome调试中的令牌--实际上我只看到

_token=N5HD2apC6VH5T7YAgXqgNT209zk2DmTdddm0JXcf

没有关于TAS和文件的事为什么？谢谢

Answer 1

在标签中添加多部分-

<form method="POST" enctype="multipart/form-data" id="uploadFileFrm">

像这样改变AJAX调用-

$('#uploadFileFrm').submit(function(e) {
    e.preventDefault();
    var formData = new FormData(this);
    $.ajax({
        type: 'POST',
        url: "{{ url('/uploadfile') }}",
        data: formData,
        cache: false,
        contentType: false,
        processData: false,
        success: (data) => {
            this.reset();
            alert('File has been uploaded successfully');
            console.log(data);
        },
        error: function (data) {
            console.log(data);
        }
    });
});