how so I respond to user while POST is processing? - php

Question

I have a form that takes a json file and POSTs to a server side process. It's a lengthy process and I want to message it's progress back to the user in real time with multiple messages.
What are my options?
This process can take 10-15 minutes or higher. I am not looking for the answer "AJAX". there is more to it than that.
this is what I got for a form:
<form method="POST" accept-charset="UTF-8" class="smart-form" id="import-course" enctype="multipart/form-data">
<fieldset>
<div class="row">
<section class="col col-md-12">
<label class="input input-file">
<input class="button" name="import" type="file">
</label>
</section>
</div>
</fieldset>
<footer>
<button class="btn btn-primary" id="submit-import-file" type="button">Save</button>
<a onclick="history.back();" class="btn btn-default">Cancel</a>
</footer>
</form>
Here is my ajax:
$(document).ready(function(){
$("#submit-import-file").on('click',function(){
console.log('click');
$('#import-course').hide();
var formData = new FormData($('#import-course')[0]);
$.ajax({
url: '{{URL::route("courses.import")}}', //Server script to process data
type: 'POST',
xhr: function() { // Custom XMLHttpRequest
var myXhr = $.ajaxSettings.xhr();
if(myXhr.upload){ // Check if upload property exists
myXhr.upload.addEventListener('progress',progressHandlingFunction, false); // For handling the progress of the upload
}
return myXhr;
},
//Ajax events
success: function(data){
console.log(data);
},
// Form data
data: formData,
//Options to tell jQuery not to process data or worry about content-type.
cache: false,
contentType: false,
processData: false
});
});
});
function progressHandlingFunction(e){
console.log(e);
}
and here is my server side pay attention to the comments.
$errors = 0;
$file = Input::file('import');
$fileName = $file->getClientOriginalName();
$destinationPath = app_path()."/storage/files/";
$file->move($destinationPath, $fileName);
$course = json_decode(File::get($destinationPath.$fileName));
if(!File::isDirectory($destinationPath.$course->code)){
File::makeDirectory($destinationPath.$course->code,0777,true,true);
//message back directory created
}
foreach($course->file as $file){
if(FileManger->processfile($file)){
//message back $file->name imported
}else{
//message back error importing $file->name
}
}
return "import complete";
So now.. How do i get the comment areas to be messaged back to the user while this processes. not after.

Answer 1

You should use Ajax to post the data to the php page without refreshing. The below code will display "Loading" until the ajax call is complete. You could use a gif or something instead. It's more difficult to do a progress bar / percentage complete but you could look at this answer as a reference. PHP Ajax Upload Progress Bar
$.ajax({
url: "domain.com/url",
type: "POST",
data: data,
cache: false,
beforeSend: function() {
$('#response').html("Loading");
},
success: function(data) {
$('#response').html(data);
}
}

Answer 2

You can still use a jquery progressbar. Write the progress of the processing out to the UI and calculate some form of percentage based on the progress through the processing. That of course assumes there is more than one step to the processing of course...! A progress bar that goes from 0 to 100% in one step isn't terribly useful.