web-dev-qa-db-fra.com

Mémoriser et repeupler l'entrée de fichier

Remarque:

La ou les réponses ci-dessous reflètent l'état des navigateurs hérités en 2009. Vous pouvez désormais définir la valeur de l'élément de saisie de fichier via JavaScript en 2017.

Voir la réponse dans cette question pour plus de détails ainsi qu'une démo:
Comment définir la valeur d'entrée du fichier par programme (c'est-à-dire lorsque vous faites glisser des fichiers)?

J'ai un site Web qui permet à l'utilisateur de télécharger un fichier plusieurs fois pour le traitement. Pour le moment, je n'ai qu'un seul fichier en entrée, mais je veux pouvoir me souvenir du choix des utilisateurs et l'afficher à l'écran.

Ce que je veux savoir faire, c’est qu’après la sélection d’un fichier par un utilisateur, je retiens son choix et affiche à nouveau le fichier saisi avec le fichier présélectionné lors du rechargement de la page. Tout ce que j'ai besoin de savoir, c'est comment se rappeler et repeupler une entrée de fichier. 

Je suis également ouvert aux approches qui n'utilisent pas une entrée de fichier (si cela est possible).

J'utilise JQuery

javascripthtmlhtml5file-uploadfileapi
41
user1150103

Créez un champ de saisie sur votre formulaire. Lorsque l'utilisateur sélectionne un fichier, copiez le résultat dans ce champ, par exemple:

jQuery('#inFile').change(
 function(){ jQuery('#inCopy').val( jQuery('#inFile').val() ); }
);

En réalité, le résultat n'est pas copié exactement, mais "C:/fakepath/SELECTED_FILE_NAME". Bien que vous ne soyez pas autorisé à définir la valeur d'une entrée de fichier, vous pouvez définir la valeur du champ de saisie de texte sans le "C:/fakepath /" lors de la préparation du formulaire par le serveur.

Maintenant, lorsque le serveur récupère le formulaire, vérifiez le champ de saisie de texte. S'il commence par "C:/fakepath /", l'utilisateur doit avoir sélectionné un nouveau fichier. Téléchargez donc sa nouvelle sélection. Si ce n'est pas le cas, l'utilisateur a opté pour la sélection précédente, ce qui ne devrait pas poser de problème puisque, conformément à la question initiale, le choix précédent a déjà été chargé et DEVRAIT (au moins avec une programmation appropriée, il PEUT être) sur le serveur.

1
DaveWalley

Au risque de marcher sur les informations formidables fournies par GitaarLAB, je pourrais suggérer que DaveWalley est très proche et offre une solution pratique au problème. Vous m'avez beaucoup aidé tous les deux, alors merci.

Mon message à retenir est,

  1. L'entrée de fichier offre une rue à sens unique. Il attend là-bas pour gérer votre prochain téléchargement. C'est tout ce que ça fait, à peu près. Il reçoit . 
  2. Une entrée de texte div ou en lecture seule à proximité du libellé de votre entrée de fichier peut faire la portion . Cela peut être utilisé pour dire à l'utilisateur: "Voici ce qui est actuellement chargé:" - le nom du fichier à afficher devra être renseigné à partir de votre logique côté serveur.

Donc, un cas d'utilisation de base serait:

  • l'utilisateur télécharge le fichier via la saisie de formulaire sur la page Web 
  • La logique côté serveur stocke le fichier 
  • Dans un cycle Ajax ou une page Web, recharger le code côté serveur identifie une chaîne nomFichier à écrire dans le div, "Voici ce qui est actuellement chargé" 
  • L'entrée du fichier peut également être présentée à nouveau, de sorte que l'utilisateur peut également télécharger un autre fichier/à la place.

Vous devrez peut-être effectuer un peu plus de travail pour gérer une validation "* obligatoire", mais c'est une autre histoire.

0
owenmck