mercredi 9 novembre 2016

Laravel form - show file upload progress, then redirect to view when uploading finishes

I have a laravel application which successfully uploads files. I need to show a progress bar when the files are uploading since users might upload videos and then redirect to a certain view when uploading finishes. I have tried a few solutions which actually worked but not to my taste. For example, i tried DropZone but i only upload one file and i don't need the drag and drop feature. The solution that worked and came close to what i wanted is using jquery.form plugin. But the problem with it was, i still want the form to submit and redirect to the next page when the file upload finishes. Meaning, when uploading finishes, i still want the next line to be executed

return redirect()->action('PostController@edit', $post->PostID);

Here is my Controller (PostController)

public function attachstore(Request $request, $PostID)
{

$post = Post::findOrFail($PostID);

if ($request->hasFile('TextFile')) {
    $TextName = "";

    $now = \DateTime::createFromFormat('U.u', microtime(true));
    $nowStr = $now->format("m-d-Y-H-i-s-u");

    $TextName =  $nowStr . '.' . $request->file('TextFile')->getClientOriginalExtension();
    $request->file('TextFile')->move(base_path() . '/public/textuploads/', $TextName);
    $post->PostText = $TextName;  
}  


if ($request->hasFile('VideoFile') and $request->input('StoryUploadType') == 3) {
    $VideoName = "";
    $now = \DateTime::createFromFormat('U.u', microtime(true));
    $nowStr = $now->format("m-d-Y-H-i-s-u");

    $VideoName =  $nowStr . '.' . $request->file('VideoFile')->getClientOriginalExtension();
    $request->file('VideoFile')->move(base_path() . '/public/videouploads/', $VideoName);
    $post->PostVideo = $VideoName; 
}  

$post->Save();

return redirect()->action('PostController@edit', $post->PostID);

}

Here is my view (attach.blade.php)

   {!! Form::open(array('route' => array('posts.attachstore', $post->PostID), 'files' => true)) !!}
   <div class="col-md-12">    
    <div class="form-group">     
      {!! Form::file('TextFile', null, array('class'=>'form-control')) !!}
    </div>
  </div>

  <div class="col-md-12">    
    <div class="form-group">     
      {!! Form::file('VideoFile', null, array('class'=>'form-control')) !!}
    </div>
  </div>

  {!!Form::button('Next', array('type' => 'submit', 'class' => 'btn btn-primary finish col-md-4'))  !!}
  {!! Form::close() !!}

I don't know whether this could be done without using ajax, but i'd prefer a solution which uses ajax only to report how much file the server has received or the client has sent. I don't want to upload the files using ajax, only an estimate of the transferred file size.



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire