Блог

У меня есть форма с перетаскиванием файла для ввода, которую я изначально нашел здесь:

http://codepen.io/prasanjit/pen/NxjZMO

форма выглядит следующим образом:

      <form method="POST"  action="{{ url('images/save') }}">
        <div class="file-drop-area">
           <span class="fake-btn">Choose file</span>
           <span class="file-msg js-set-number">or drag and drop file here</span>
           <input class="file-input" type="file" name="fileUpload">
        </div>
        <button>Save</button>
        <input type="hidden" name="_token" value="{{ csrf_token() }}">
     </form>
  

JS не изменился по сравнению с исходным pen:

 $(document).ready(function () {

var $fileInput = $('.file-input');
var $droparea = $('.file-drop-area');

// highlight drag area
$fileInput.on('dragenter focus click', function() {
  $droparea.addClass('is-active');
});

// back to normal state
$fileInput.on('dragleave blur drop', function() {
  $droparea.removeClass('is-active');
});

// change inner text
$fileInput.on('change', function() {
  var filesCount = $(this)[0].files.length;
  var $textContainer = $(this).prev('.js-set-number');

  if (filesCount === 1) {
    // if single file then show file name
    $textContainer.text($(this).val().split('\').pop());
  } else {
    // otherwise show number of files
    $textContainer.text(filesCount   ' files selected');
  }
});

}); 
  

Проблема в том, что когда я передаю это через контроллер, файл отображается как null при использовании

 $file = $request->file('fileUpload');
  

однако при использовании

 $file = $request->get('fileUpload');
  

и затем, когда вы сбрасываете $ file, оказывается, что запрос get фактически получает имя пользователя. Так что он умрет, сбросив что-то вроде «image01.jpg «.

Кроме того, при добавлении проверки в форму,

         $this->validate($request, [
            'fileUpload' => 'required',
        ]); 
  

форма будет загружена только после того, как вы прикрепите файл.

Итак, что происходит? Почему это отображается как null при запросе файла?

 <form method="POST"  action="{{ url('images/save') }}" enctype="multipart/form-data">