I have a problem with load bar. I have a file named site.php, load.js and file.php my system read an excel file, and extract the data in a array, I want to display the progress but of the reading row excel file, not of the upload of the excel file.
my site.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link href="css/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<script type="text/javascript" src="js/jquery.js">
</script>
</head>
<body>
<div class="progress" style="width:90%; margin:20px auto;">
<div id="barra_progreso" class="progress-bar progress-bar-danger progress-bar-striped active" role="progressbar" aria-valuenow="1" aria-valuemin="0" aria-valuemax="100" style="width: 0%">
<span class="sr-only"></span>
</div>
</div>
</body>
</html>
load.js
var datos = new FormData();
datos.append('excel', file);
$.ajax({
url: 'file.php',
type: 'POST',
data: datos,
processData: false,
contentType: false
}).done(function(r) {
$("#msgOK").html(r);
}
file.php
$cant = $excel->getRow() + 1;
sleep(1);
echo "<script type='text/javascript'>
$(function() {
var progressbar = $('#barra_progreso'),
**max = 25**,
value = 0;
var loading = function() {
value += 1;
addValue = progressbar.val(value);
if (value <= (1 / 3 * max)) {
progressbar.addClass('progress-bar-danger')
} else if (value <= (2 / 3 * max)) {
progressbar.removeClass(' progress-bar-danger ');
progressbar.addClass('progress-bar-warning')
} else {
progressbar.removeClass('progress-bar-warning');
progressbar.addClass('progress-bar-success')
}
var porc = (value / max) * 100;
var valor = parseFloat(Math.round(porc * 100) / 100).toFixed(2);
progressbar.css({
width: porc + '%'
});
progressbar.html(valor + '%');
if (value == max) {
clearInterval(animate);
alert('carga completada');
}
};
var animate = setInterval(function() {
loading();
}, 1000);
});
</script>";
flush();
ob_flush();
Every function worked good, but the load bar displayed after the reading of the excel file, I know that behavior is due the ajax.done, I print the max rownum of my excel file and with this value I work in the load bar. Any way for fix this problem ?