Bonjour,
Voila je rencontre un petit problème avec mon code.
L'objectif étant de faire une bare de progression sur l'insert en base de donnée.
index.php
<form class="cmxform" enctype="multipart/form-data" action="<?php echo base_url();?>bdd/charger">
<div class="control-group">
<label class="control-label">Selectionner un fichier</label>
<div class="controls">
<input type="file" name="fichier" class="default">
</div>
</div>
<a style="display:none" class="submit btn btn-success">Envoyer</a>
<div class="control-group">
<div style="display:none" class="progress progress-striped progress-info active">
<div style="width: 0%;" class="bar"></div>
</div>
</div>
</form>
$('.submit').off().on('click',function(){
var form = $(this).parents('form');
var progressBar= form.find('.progress').first();
var submit = $(this);
$(form).ajaxSubmit({
type: 'POST',
dataType : 'json',
async: true,
beforeSubmit: function(formData, jqForm, options){
submit.hide();
progressBar.show();
$("body").css("cursor", "progress");
loader.show();
progressBar.find('.bar').width('0 %');
progression = setInterval(function(){
$.ajax({
url:"<?php echo base_url(); ?>bdd/showProgress",
async: true,
type: 'get',
dataType: 'json',
success: function(result){
res = result['pourcentage'];
console.log(result);
progressBar.find('.bar').width(res+'%');
if(res == 100){
clearInterval(progression);
}
},error: function(result){
}
});
}, 400);
},success : function(result){
setTimeout(function(){
$("body").css("cursor", "default");
progressBar.fadeOut(100);
clearInterval(progression);
submit.show();
},500);
},error: function(response){
setTimeout(function(){
$("body").css("cursor", "default");
progressBar.hide();
submit.show();
clearInterval(progression);
},500);
}
});
});
bdd.php
// Fonction permettant de Charger le fichier des sociétaires et de l'envoyer au modèle
public function charger(){
$file_path = $this->uploadFile();
$data = array();
session_start();
$_SESSION['progress']['pourcentage'] = 0;
session_write_close();
$this->load->model('bdd_model');
echo($this->bdd_model->get_ajout($file_path));
echo $_SESSION['Chargement'];
//$this->template->view('welcome/index', $data);
//echo "<br>Importation terminée, avec succès.";
}
// Fonction permettant d'afficher la progression de la barre
public function showProgress(){
//session_start();
//$_SESSION['progress']['pourcentage'] = 80;
if(isset($_SESSION['progress'])){
echo json_encode($_SESSION['progress']);
}
//session_write_close();
}
bdd_model.php
public function get_ajout($file_path){
set_time_limit(0);
$this->load->database();
if(file_exists($file_path)){
$fp = fopen("$file_path","r");
echo "Fichier trouve";
}else {
echo "Fichier introuvable!<br>Importation stoppée.";
exit();
}
$nbChargement = 0;
while (!feof($fp))
{
$ligne = fgets($fp,4096);
$ligne = preg_replace ("/\s+/"," ", $ligne);
$liste = explode(" ",$ligne);
$valeur = $liste[0];
$caisse = substr($valeur, 0,4);
$idSocietaire = substr($valeur, 1,8);
/*if(count($liste) == 4){
$nom = $liste[1] + $liste[2];
$prenom = $liste[3];
}
elseif (count($liste) == 5){
$nom = $liste[1] + $liste[2];
$prenom = $liste[3] + $liste[4];
}
else {*/
$nom = $liste[1];
$prenom = $liste[2];
/*}*/
// On insére dans la base de donné.
try {
$query = array(
'id' => $id,
'nom' => $nom,
'prenom' => $prenom,
'ville' => $ville
);
$this->db->insert('personne',$query);
$nbChargement+=1;
// Incrémentation de la variable de Session Chargement qui servira pour la progress Bar.
$count = round($nbChargement/count($ligne)*100);
$this->updateProgressBar($count);
}
//$query = "INSERT INTO personne (id,nom,prenom,ville) VALUE('$id','$nom','$prenom','$ville')";
//$this->db->query($query);
}catch (Exception $e){
error_log($e);
}
}
echo "<br>Importation terminée, avec succès.";
fclose($fp);
}
public function updateProgressBar($value){
session_start();
$_SESSION['progress']['pourcentage'] = $value;
//$_SESSION['progress']['pourcentage'] = 80;
session_write_close();
}
Le souci c'est que $_SESSION['progress']['pourcentage'] est toujours égale à 0.
J'ai d'abord regarder si cela venait de mon controleur . J'ai donc mis une valeur fixe et la progress bar m'a bien mis 80%.
Si maintenant je veux faire le changement sur le model, là impossible d'aller au delà de 0.
Une idée de où cela pourrait venir?
Salut,
C'est un peu "dégueulasse" la façon dont tu gères ta progression non ?
Tu devrais plutôt regarder du côté de l'event XMLHttpRequest onprogress
.
Un petit exemple en vanilla JS (http://devdocs.io/dom/progressevent) :
var progressBar = document.getElementById("p"),
client = new XMLHttpRequest()
client.open("GET", "magical-unicorns")
client.onprogress = function(pe) {
if(pe.lengthComputable) {
progressBar.max = pe.total
progressBar.value = pe.loaded
}
}
client.onloadend = function(pe) {
progressBar.value = pe.loaded
}
client.send()
Sinon, un exemple avec jQuery : http://www.dave-bond.com/blog/2010/01/JQuery-ajax-progress-HMTL5/