Send files by ajax in laravel

0

I have a form with ajax and I need to send two image files, if I send it without the ajax it works well, but I want to send it with ajax and it is not working. The data is received but it does not send the file by ajax, So the question is:

How can I send two files per ajax in laravel?

<form class="form-horizontal" id="formmass" role="form" accept-charset="UTF-8" enctype="multipart/form-data">

    <input type="text" class="form-control" id="id_mass"  disabled>
    <input type='text' class='form-control input-number-line' id='fecha_mass'  maxlength='45'   required='required' autofocus>
    <input type='file' class='form-control' id='fotogeneral_mass_file' maxlength='45'   required='required' autofocus>  
    <input type='file' class='form-control' id='fotodetalle_mass_file' maxlength='45'   required='required' autofocus>                  

    <button type="button" id="acciones" class="btn btn-warning edit" data-dismiss="modal">Editar</button>

</form>
<script type="text/javascript">

$('.modal-footer').on('click', '.edit',function(){
        //var formData = new FormData();
        var formData = new FormData($("#formmass")[0]);
        formData.append('id',$('#id_mass').val());
        formData.append('fecha',$('#fecha_mass').val());
    //  formData.append('fotogeneral_mass_file',$('#fotogeneral_mass_file'));
    //  formData.append('fotodetalle_mass_file',$('#fotodetalle_mass_file'));
        formData.append('_token',$('input[name=_token]').val());

        $.ajax({
            type: 'Post',
            url: '../update/'+id,
            data: formData,
            cache: false,
            contentType: false,
            processData: false,
            error: function(jqXHR, text, error){
            toastr.error('Validation error!', 'No se pudo Añadir los datos<br>'+error, {timeOut: 5000});    
            },
            success: function(data){
            toastr.error('Validation true!', 'se pudo Añadir los datos<br>'+error, {timeOut: 5000});    

            }


        });
});
</script>

In the controller I have the following file, where I take the file name and save it, if I do it without ajax it works for me.

<?php
        $file = Input::file('fotogeneral_mass_file');
        $nombre = $file->getClientOriginalName();
        \Storage::disk('local')->put($nombre,  \File::get($file));

        $file2 = Input::file('fotodetalle_mass_file');
        $nombre = $file2->getClientOriginalName();
        \Storage::disk('local')->put($nombre,  \File::get($file2));
    
asked by marcos alberto saavedra sanabr 27.04.2018 в 18:41
source

2 answers

1

You could add the attribute name="" to the <input /> and instead of putting an event in the click , you directly change the type by type="submit" , then you could capture the event of submit and do the following :

$('#formmass').on('submit', function(e) {
  // evito que propague el submit
  e.preventDefault();
  
  // agrego la data del form a formData
  var formData = new FormData(this);
  formData.append('_token', $('input[name=_token]').val());

  $.ajax({
      type:'POST',
      url: '../update/' + id,
      data:formData,
      cache:false,
      contentType: false,
      processData: false,
      success:function(data){
          toastr.error('Validation true!', 'se pudo Añadir los datos<br>', {timeOut: 5000});
      },
      error: function(jqXHR, text, error){
          toastr.error('Validation error!', 'No se pudo Añadir los datos<br>' + error, {timeOut: 5000});
      }
  });
});
<form class="form-horizontal" id="formmass" role="form" accept-charset="UTF-8" enctype="multipart/form-data">

    <input type="text" name="id" class="form-control" id="id_mass"  disabled>
    <input type='text' name="fecha" class='form-control input-number-line' id='fecha_mass'  maxlength='45' required='required' autofocus>
    <input type='file' name="fotogeneral_mass_file[]" class='form-control' id='fotogeneral_mass_file' maxlength='45' required='required' autofocus>  
    <input type='file' name="fotogeneral_mass_file[]" class='form-control' id='fotodetalle_mass_file' maxlength='45' required='required' autofocus>                  

    <button type="submit" id="acciones" class="btn btn-warning edit" data-dismiss="modal">Editar</button>

</form>
    
answered by 27.04.2018 / 20:17
source
-2

I think the post is lowercase, like this:

type: 'post',
    
answered by 27.04.2018 в 19:26