Accueil > Forum > > > > Progress Bar pour upload de fichiers
 Progress Bar pour upload de fichiers
jeudi 24 novembre 2011 à 18:14:13 |
Progress Bar pour upload de fichiers
AcarnanDragoon
|
Bonjour à tous,
Voila mon soucis. J'ai utilisé le système Jqueryfiletree pour créer une arborescence de fichiers qui permet de voir les fichiers, en téléchargé, en uploader, créer des dossiers...
Mais voila, il faut que cette application puisse télécharger des fichiers un petit peu volumineux (150Mo par exemple), le problème c'est que JqueryFiletree ne possède pas de progress bar pour l'upload de fichier, ce qui fait qu'il est difficile de savoir ou on en est dans l'envoi du fichier ;-)
Bref j'ai fouillé sur le net et j'ai notamment trouvé des choses types APC ou swfupload des choses comme ça. Le problème c'est que mes formulaires d'upload sont déjà fait et je galère un peu a essayer de mettre en place une progress bar.
Quelqu'un aurait il une progressbar simple à mettre en place pour l'upload de fichier, sur des formulaires déjà réalisés ?
Bonne soirée à tous ! Et merci pour votre temps ! |
|
vendredi 25 novembre 2011 à 01:02:15 |
Re : Progress Bar pour upload de fichiers
camillagaiaschicherie
|
bonjour,
comme tu utilise deja jquery peut etre ceci
https://github.com/drogus/jquery-upload-progress
|
|
vendredi 25 novembre 2011 à 09:19:14 |
Re : Progress Bar pour upload de fichiers
AcarnanDragoon
|
Bonjour et merci de ta réponse,
Je vais regarder ça de près et je reviens pour dire si c'est ce qu'il me fallait. Merci d'avoir pris le temps de chercher et de répondre ! Bonne journée !
|
|
vendredi 25 novembre 2011 à 10:02:03 |
Re : Progress Bar pour upload de fichiers
AcarnanDragoon
|
Bon, j'ai regardé mais même l'exemple qu'il propose ne fonctionne pas... En fait ce qu'il me faudrait c'est simplement un moyen d'interroger le serveur sur l'état d'avancement de l'upload. Mais jusqu'ici je patauge... Bref je vais continuer de chercher, si quelqu'un à une idée je suis preneur !
|
|
vendredi 25 novembre 2011 à 15:58:42 |
Re : Progress Bar pour upload de fichiers
AcarnanDragoon
|
Réponse acceptée !
Pour ceux que ça intéresse j'ai trouvé ceci, qui correspond parfaitement à ce qu'il me faut :
http://webdeveloperplus.com/jquery/multiple-file-upload-with-progress-bar-using-jquery/
Voila Bon codage à tous !
|
|
vendredi 25 novembre 2011 à 17:32:47 |
Re : Progress Bar pour upload de fichiers
camillagaiaschicherie
|
Réponse acceptée !
bonjour,
sans javascript juste avec du html5 cela donne
Code HTML : <!DOCTYPE html>
<html>
<head>
<title>Upload Files using XMLHttpRequest - Minimal</title>
<script type="text/javascript">
function fileSelected() {
var file = document.getElementById('fileToUpload').files[0];
if (file) {
var fileSize = 0;
if (file.size > 1024 * 1024)
fileSize = (Math.round(file.size * 100 / (1024 * 1024)) / 100).toString() + 'MB';
else
fileSize = (Math.round(file.size * 100 / 1024) / 100).toString() + 'KB';
document.getElementById('fileName').innerHTML = 'Name: ' + file.name;
document.getElementById('fileSize').innerHTML = 'Size: ' + fileSize;
document.getElementById('fileType').innerHTML = 'Type: ' + file.type;
}
}
function uploadFile() {
var fd = new FormData();
fd.append("fileToUpload", document.getElementById('fileToUpload').files[0]);
var xhr = new XMLHttpRequest();
xhr.upload.addEventListener("progress", uploadProgress, false);
xhr.addEventListener("load", uploadComplete, false);
xhr.addEventListener("error", uploadFailed, false);
xhr.addEventListener("abort", uploadCanceled, false);
xhr.open("POST", "upload.php");
xhr.send(fd);
}
function uploadProgress(evt) {
if (evt.lengthComputable) {
var percentComplete = Math.round(evt.loaded * 100 / evt.total);
document.getElementById('progressNumber').innerHTML = percentComplete.toString() + '%';
}
else {
document.getElementById('progressNumber').innerHTML = 'unable to compute';
}
}
function uploadComplete(evt) {
/* This event is raised when the server send back a response */
alert(evt.target.responseText);
}
function uploadFailed(evt) {
alert("There was an error attempting to upload the file.");
}
function uploadCanceled(evt) {
alert("The upload has been canceled by the user or the browser dropped the connection.");
}
</script>
</head>
<body>
<form id="form1" enctype="multipart/form-data" method="post">
<div class="row">
<label for="fileToUpload">Select a File to Upload</label><br />
<input type="file" name="fileToUpload" id="fileToUpload" onchange="fileSelected();"/>
</div>
<div id="fileName"></div>
<div id="fileSize"></div>
<div id="fileType"></div>
<div class="row">
<input type="button" onclick="uploadFile()" value="Upload" />
</div>
<div id="progressNumber"></div>
</form>
</body>
</html>
|
|
vendredi 25 novembre 2011 à 17:33:22 |
Re : Progress Bar pour upload de fichiers
|
mercredi 7 décembre 2011 à 15:37:40 |
Re : Progress Bar pour upload de fichiers
AcarnanDragoon
|
Hello et merci !
Je vais tester merci pour le code et bonne journée !
|
|
Cette discussion est classée dans : fichier, progress, bar, upload, fichiers
 Répondre à ce message
 Sujets en rapport avec ce message
Compresser les fichiers pour Upload [ par Hpic ]
Bonjour ,Quelqu'un aurait-il l'amabilité de m'expliquer comment compresser un fichier en *.*.zip lors de l'upload du fichier sur un serveur ( apache
upload de fichiers [ par cakekiller ]
Salut,voilà mon pb:Je cherche à uploader un fichier sur un serveur. Ma page de sélection de fichier est la suivante: <input name="fichi
Upload fichier php [ par alanbraxe31 ]
Bonjour à tous!voila j'ai un gros soucis avec la fonction mail en php.je souhaites joindre un fichier à mon mail. A la réception du mail, les fichiers
Upload de fichier: [ par Zebra1928 ]
bonjour à tous;j'ai besoin de votre aide svp, mon pb est que je voudrai enregistrer des fichiers à partir de n'importe quel poste sur le serveur, donc
Upload de fichiers [ par Zebra1928 ]
salut à tous;;j'ai la portion de code suivante:$chemin="/home/www.monsite.com";$chemin=addslashes($chemin);copy($fichier, $chemin);jusque là ça marche
[Upload] "Cassage" de fichiers? [ par ricopetitdejeuner ]
Bonjour, Je suis en train de reprendre un code en php d'upload de fichiers sur un FTP (interne a la boite, donc pas de souci comme pour Free, d'
Upload progress bar avec ajax [ par Linuss ]
Bonjour à tous, J'ai trouvé sur internet pas mal de scripts d'upload, mais chacun avait ses inconvénients : <a h
supprimer un fichier et taille fichier upload [ par joebuz ]
voila j'ai une partie admin pour ajouter des fichiers en upload, ces fichiers sont photos, chansons, et videos.Le probleme c'est que pour les chansons
Ajouter d'un hide dans un ligne de code [ par phhav ]
Voila mon probleme... ------------------------------------------------------------------------ if(imbedded_progress_bar){ document.form_upload.imbedd
Faisable ou pas ? upload gros fichiers [ par caviar ]
salut ...ça fait un moment que je cherche un script qui permette d'uploader de gros fichiers sur un serveur sans se tapper un connection time out ou u
 Livres en rapport
|
Derniers Blogs
 ROSLYN FLUENT APIS: ROSLYNHELPER NUGET PACKAGEROSLYN FLUENT APIS: ROSLYNHELPER NUGET PACKAGE par Matthieu MEZIL
Si vous utilisez Roslyn et que vous vous voulez vous simplifier le code du code rewriter, je vous conseille d'installer mon NuGet package RoslynHelper ....(read more) ...
Cliquez pour lire la suite de l'article par Matthieu MEZIL POUR RAPPEL ! LES SPéCIFICATIONS DES PROTOCOLES OFFICE ET SHAREPOINT SONT DISPONIBLES SUR MSDNPOUR RAPPEL ! LES SPéCIFICATIONS DES PROTOCOLES OFFICE ET SHAREPOINT SONT DISPONIBLES SUR MSDN par neodante
Quelle est le point commun entre : Microsoft il y a 10 ans et Apple aujourd'hui ? Réponse: avoir une politique de protocoles propriétaires et fermés :) Car pour rappel (si si je vous assure c'est important de le rappeler), la majorité des spécifications e...
Cliquez pour lire la suite de l'article par neodante JOYEUX ANNIVERSAIRE NIXJOYEUX ANNIVERSAIRE NIX par ebartsoft
Souhaitons un bon et joyeux anniversaire à notre hôte à tous, Nix.
Je ne le répéterais jamais assez mais sans lui rien ne serait possible. Il défit en permanence les lois de la gravité et comme il le dit si bien, si tu lui fais confiance ça devra...
Cliquez pour lire la suite de l'article par ebartsoft IMAGINE CUP 2012, MAKE A SIGN EN FINALEIMAGINE CUP 2012, MAKE A SIGN EN FINALE par junarnoalg
Voilà qui est fait, la nouvelle est officielle ! L'équipe belge "Make a Sign" va au pays des kangourous défendre son projet dans la catégorie Software Design. http://www.imaginecup.com/CompetitionsContent/Competition/WorldwideFinalists.aspx V...
Cliquez pour lire la suite de l'article par junarnoalg KINECT 1.5 IS OUT !KINECT 1.5 IS OUT ! par Vko
La version 1.5 du Kinect For Microsoft vient tout juste de sortir ! Plein de nouveautés: Tracking de squelette en Near Mode Détection en position assise Détection faciale avec un SDK dédié Documentation et des guideline (enfin) Un out...
Cliquez pour lire la suite de l'article par Vko
Logiciels
 sDEVIS-FACTURES vlPRO (8.1.0.3)SDEVIS-FACTURES VLPRO (8.1.0.3)sDEVIS-FACTURES vlPRO a été mis au point pour les particuliers, créateurs, entrepreneurs, artisa... Cliquez pour télécharger sDEVIS-FACTURES vlPRO 974 Application Server (12.2.4.6)974 APPLICATION SERVER (12.2.4.6)Développez de puissantes applications dans un environnement de 'cloud computing', clusterisé, séc... Cliquez pour télécharger 974 Application Server vPicture (1.4.2.1)VPICTURE (1.4.2.1)Avec vPicture, hébergez vos images facilement et rapidement.
vPicture est un utilitaire simple, ... Cliquez pour télécharger vPicture Easy-Planning (2.2.1.6)EASY-PLANNING (2.2.1.6)Easy-Planning permet de créer des plannings sous la représentation de diagrammes et est adapté au... Cliquez pour télécharger Easy-Planning COM-BACKUP (2.0)COM-BACKUP (2.0)
COM-BACKUP est un logiciel de sauvegarde qui permet de planifier les sauvegardes de vos dossiers ...
Cliquez pour télécharger COM-BACKUP
|