Reselectionner les fichiers précédemment selectionnées par l'utilisateur dans un champ d'upload

**westernz** · 18/03/2017, 07h25

Bonjour,

Cas :
Le visiteur sélectionne ses fichiers sur son dur.
Le form est en erreur pour x raison.
Retour au form.
Je replace les valeurs précédente dans les inputs.

Est-il possible de resélectionner automatiquement les fichiers que le visiteur avait précédemment sélectionné ?
Je suppose que non mais je pose quand même la question pour confirmation.

Bonne journée

**badaze** · 18/03/2017, 09h55

C'est possible via le localStorage. Tu peux y sauvegarder des données puis les rappeler. Il faudra que tu fasses en sorte de supprimer les données si pas de problème sans quoi elles seront représentées la fois suivante.

Un exemple: Tape du texte. Clique sur Enregistre... clique sur Efface le contenu... puis sur Charge depuis ...

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<html>
<head>
<script>
function save() {
  localStorage.setItem("ma_sauvegarde",document.getElementById('comment').innerHTML);
}
function load() {
  if (localStorage.getItem("ma_sauvegarde") == null ) {
   alert("Aucune sauvegarde n''a été faite !!!");
   return;
  }
  document.getElementById('comment').innerHTML = localStorage.getItem("ma_sauvegarde");
}
function clearDiv() {
  
  document.getElementById('comment').innerHTML = '';
}
</script>
</head>
<body>
 Tape quelque chose ci-dessous :
 <hr />
    <div id="comment" class="comment" contenteditable>
  <p><b><span>texte à sélectionner dans une balise p</span></b></p><br/>
  texte à sélectionner qui n'est pas dans une balise p
 </div>
    <hr />
 <input type="button" id="s" value="Enregistre dans le local storage" onclick="save()"/>&nbsp;
 <input type="button" id="l" value="Charge depuis le local storage" onclick="load()"/>&nbsp;
 <input type="button" id="c" value="Efface le contenu du div" onclick="clearDiv()"/><br /> 
</body>
</html>

**westernz** · 20/03/2017, 05h48

Si tu mets un input file dedans tu verra que ca ne fonctionne pas.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<!DOCTYPE html>
<html>
<head>
<script>
function save() {
  localStorage.setItem("ma_sauvegarde",document.getElementById('comment').innerHTML);
}
function load() {
  if (localStorage.getItem("ma_sauvegarde") == null ) {
   alert("Aucune sauvegarde n''a été faite !!!");
   return;
  }
  document.getElementById('comment').innerHTML = localStorage.getItem("ma_sauvegarde");
}
function clearDiv() {
 
  document.getElementById('comment').innerHTML = '';
}
</script>
</head>
<body>
   <form action='candidatures.php' method="post"  enctype="multipart/form-data">
    Fonctionne : <input type="file" name='photo1' id='photo1'>
  </form>
 Tape quelque chose ci-dessous :
 <hr />
    <div id="comment" class="comment" contenteditable>
  <p><b><span>texte à sélectionner dans une balise p</span></b></p><br/>
  texte à sélectionner qui n'est pas dans une balise p
     <form action='candidatures.php' method="post"  enctype="multipart/form-data">
    Fonctionne pas : <input type="file" name='photo1' id='photo1'>
  </form>
  <br /><br />
 
    <hr />
 <input type="button" id="s" value="Enregistre dans le local storage" onclick="save()"/>&nbsp;
 <input type="button" id="l" value="Charge depuis le local storage" onclick="load()"/>&nbsp;
 <input type="button" id="c" value="Efface le contenu du div" onclick="clearDiv()"/><br /> 
</body>
</html>