Version imprimable
:salut:
FirePrawn vous propose une traduction de l'article HTML5 Drag and Drop Multiple File Uploader par Andrey Prikaznov.
N'hésitez pas à faire part de vos remarques et commentaires au sujet de cet article.
:fleche: Uploader de fichiers multiples avec du drag and drop.
:merci:
Bonjour,
merci pour cet article :ccool:
Ca m'a pas l'air top sur IE non ? (j'ai testé qu'avec IE8 alors je suis sûr de rien :aie:)
mais selon cette page, DataTransfer a l'air de ne fonctionner qu'avec un moteur Gecko
??
Bonjour,
Super article et la traduction est très fidèle à l'original ;).
Petite question: je ne comprends pas vraiment: où sont enregistrés les fichiers uploadés sur le serveur ? Je ne vois aucun dossier spécifié.
PS: je débute en javascript
Bonne journée.
Dans l'exemple donné le fichier est laissé là où le moteur PHP enregistre les fichiers envoyés par upload. C'est suffisant pour l'exemple, qui montre qu'on a des fichiers et qu'on peut en faire ce qu'on veut.
Cela veut dire qu'avec cet exemple, les fichiers ne restent pas : PHP les effacera de l'emplacement temporaire où il les a mis.
Oui je l'ai compris après coup, y'avait quelques lignes de php à ajouter en fait.
Merci pour ta réponse :merci:
Salut Last minute, tu as une idée du code php à rajouter ? j'avoue que je suis perdu. tout fonctionne mais effectivement pas de fichier dans le dossier.
Merci pour ta réponse
Cordialement
Fabien
Salut !
Je sais que l'article date un peu, mais ce script m'intéresse beaucoup pour un projet que je développes actuellement.
Pourquoi personne n'a répondu concernant l'upload des fichiers ... je comprends bien que dans l'exemple, les fichiers reste dans un emplacement temporaire et sont supprimés ensuite, mais j'aimerais savoir comment faire pour envoyer ces fichiers dans un dossier, afin de les conserver et de réaliser un upload complet ?
J'ai bien tenté de modifier l'url <input id="url" value="http://www.monsiteweb.com/upload/" /> dans le input mais apparemment cela ne change rien. Je ne vois rien non plus dans le fichier php et si j'ai bien compris l'upload se fait via le script javascript (je n'y connais pas grand chose en javascript).
Quelqu'un pourrait il enrichir ce post en indiquant la solution ?
Merci a toutes et a tous.
Citation:
Envoyé par klesse
Bonjour Fabien,
As tu eu une réponse, même si ce post date un peu, je cherche moi aussi la solution :)
Merci pour ton aide :)
Bonjour ThelvinCitation:
Envoyé par thelvin
J'en profite que tu es en ligne pour te poser la question précédente directement ... :)
Merci pour ton aide
Salut,
Faut utiliser des fonctions comme move_upload_file pour transférer des fichiers avec php. Si personne n'a répondu c'est sans doute parce que ce n'est pas le sujet initial.
Aujourd'hui les navigateurs modernes (firefox, chrome) proposent le drag and drop d'origine. Y'a donc plus de code à rajouter et il suffit de déposer les fichiers sur le bouton d'upload ou de se servir du bouton pour ouvrir l'explorateur de fichiers. On peut aussi agrandir la zone du bouton simplement en css pour faciliter le drag and drop.
Pour une solution complète et prête à l'emploi avec encore bien plus de fonctionnalités tu peux regarder ce lien.
Bonjour à toutes et tous,
J'aimerais savoir comment puis-je récupérer les images envoyées via ce système d'upload de type
"drag and drop" .
Le système fonctionne correctement toutefois j'aimerais que lesdites images soient envoyées
vers un dossier spécifique .
Quel type d'url via l'input doit-on ajouter car j'ai entré différent url mais sans aucun résultat de
récupération valable .
De plus il n'y a pas de lien d'envoi vers un fichier formulaire de récupération en php afin d'avoir les informations
envoyées via serveur .
En attente de vos suggestions.
Merci à toutes et tous .
Salut,
Tu as essayé quel script exactement ?
Si tu utilises php côté serveur, il y a une solution complète d'upload avec des exemples fonctionnels ici
Merci pour ta réponse ABCI....
J'ai ajouté le script php suivant :
https://script-tutorials.developpez....-upload-html5/
Ledit script a été ajouté et modifié au sein de mon formulaire php et tout me parait
fonctionnel toutefois je ne reçois aucun fichier (image) sur le serveur
informatique .
A l'instar de l'ancienne pagination .php ou je pouvais envoyer un seul fichier (image)
à la fois via un bouton upload au sein dudit formulaire .
Donc je voudrais pouvoir utiliser ce système afin d'envoyer plusieurs fichiers (images)
vers le serveur ou vers un dossier spécifique qui se trouve sur le serveur .
Je ne comprends pas pourquoi faut-il spécifier un url au sein de ce scipt .php
et malgré un url qui me semble correct donc je ne reçois aucun fichier (image)
Après upload,la "jauge" progression est à 100% mais je n'ai aucune réception
fichier (image).
En attente de ta suggestion ou réponse.
Merci.
Tu utilises un tuto, et comme à peu près tous les tutos, ce n'est pas un script complet et il manque la partie d'upload.
Je t'ai proposé d'utiliser un module d'upload complet prêt à l'emploi, pourquoi ne l'essayes-tu pas ? Il suffit de dézipper le dossier, le placer sur ton serveur, et tu peux commencer à faire les premiers tests avec les exemples fournis qui sont fonctionnels, c'est une histoire de quelques minutes. Eventuellement je pourrai t'aider en cas de besoin. En plus tu auras une solution beaucoup plus puissante et complète, normal puisque c'est un module conçu pour être utiliser directement sans avoir rien à programmer (mais qui laisse néanmoins toute possibilité de programmation).
Merci pour ta suggestion ABCI.......
J'ai déjà vérifié ce système d'upload complet toutefois j'aurais voulu ajouter une
réception d'image via ce type de script .
Si tu veux je t'envoie ma pagination .php afin que tu puisses peur-être trouver
la solution afin de réceptionner lesdites images vers un dossier spécifique .
Quel type de script ? Dans celui que je te propose la destination des fichiers est indiquée dans les script serveurs qui sont dans le dosssier "Php_Upload". Par exemple dans le fichier "Php_Upload/UploadAjaxABCI_Upload_Basique.php" tu trouve dans la première ligne de code :Citation:
Envoyé par userweb
Il suffit donc de modifier la valeur de $dossier_destination pour changer la destination. Où est ton problème ?Code:$dossier_destination = '../Destination_Upload1/';
Merci pour ta réponse .
J'ai vérifié ce codage .php et j'aimerais pouvoir ajouter une ligne de code de ce type
sur "mes" codages .php afin d'obtenir le même résultat afin d'obtenir un téléchargement
multiple de part le biais d'un système d'upload de type Drag and Drop.
Je veux une fonction de type Drag and Drop simplifiée sans devoir passer par des codages
complexe.
Merci pour ta compréhension.
Tu as un problème de compréhension au niveau des techniques mises en œuvre pour faire un upload ajax. Ce n'est pas en une ligne de code que tu vas pouvoir faire cela surtout pour un upload multiple. Je t'ai donné une solution complète et fonctionnelle, je ne vais pas passer du temps pour en faire une autre plus minimaliste et moins performante qui ne saura pas surpasser la configuration serveur ni gérer les erreurs par exemple.
Si cette solution ne te convient pas tu peux en trouver d'autres sur le net, mais si tu regarde le code tu le trouveras toujours complexe, parce que l'upload n'est pas simple, à moins se se limiter au minimum qui buguera à la première occasion parce que le code ne prendra pas en compte tous les problèmes que l'on peut rencontrer lors d'un upload et ils sont nombreux. C'est pour ces raisons que l'on créent des modules qui offrent une interface d'utilisation pour éviter d'avoir à se soucier du code.
Merci pour ta réponse .
Le système d'upload que j'ai réalisé fonctionne correctement mais je ne peux envoyer qu'un seul fichier de type .jpg/.png
vers un dossier spécifique qui se trouve sur le serveur informatique .
De ce fait;j'aimerais utiliser le système Drag and Drop à partir du script de base et non passer par l'utilisation de l'ajax
car je ne dispose pas des connaissances suffisantes afin d'utiliser ce type de programmation .
Donc pourrais tu vérifier mon formulaire et voir si il y a possibilité d'envoyer des fichiers de type .jpg/.png à partir
de ces mises en pages .
Ce que tu n'as pas compris c'est que le script de base C'EST DE l'AJAX (var xhr = new XMLHttpRequest();...).Citation:
Envoyé par userweb
Et quand on a pas les connaissances suffisantes pour créer ce type de programmation, (ou même si on les a mais que l'on veut gagner du temps) on utilise des modules complets comme celui-ci qui offrent une interface d'utilisation pour éviter d'avoir à se soucier du code.
Donc personnellement je ne vais pas perdre du temps pour refaire ce que j'ai déjà fait, d'autant plus qu'il te suffit de dézipper le dossier proposé en téléchargement et le poser sur ton serveur pour choisir des exemples complets déjà fonctionnels, et d'autant plus que les fonctionnalités du module font tout ce que ton script peut faire (Drag and Drop etc.) et beaucoup plus encore avec un système simplifié pour la configuration.
De ton côté tu gagnerais aussi du temps. Peut-être certains prendront le temps de compléter ce tuto (que tu utilise) pour faire la partie serveur, mais c'est pas certain car cela prend du temps.
Faisant suite à ton retour courriel donc j'ai essayé
d'utiliser le folder complet ajax/php via Wamp server
toutefois il n'y a pas la possibilité de visualiser les exemples .php
car un retour d'erreur d'alinéa de codage s'inscrit donc je ne peux
que visualiser les explications texte .
C'est pour cela que je voulais t'envoyer ma mise en page afin
que tu puisses peut-être trouver la possibilité d'utiliser
ce système de type Drag and Drop via cette pagination .
Merci pour ta compréhension .
En te souhaitant une excellente semaine .
Je veux bien t'aider pour faire fonctionner le module d'upload, mais comme ce n'est pas ici le bon endroit, je te donne la réponse là.