champ de type file qui se vide.

Bonjour à tous,

Je travaille sur un script permettant l'envoi multiple de fichier sur un serveur.

Mon problème est le suivant :

j'ai un champ file principal qui lorsque je sélectionne un fichier va dupliquer le champ et le placer dans un autre div.

Lors de la sélection du fichier1, le champ est dupliqué correctement
Lors de la sélection du fichier2, le champ est dupliqué correctement aussi mais le champ dupliqué n°1 se vide.

Y a t il une solution pour qu'il ne se vide pas?

voici le code :

Code:

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
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
 
<html>
<head>
<title>upload v2</title>
<style>
body {
  font-family : verdana;
  font-size : 11px;
  color : #666666;
}
td {
  font-family : verdana;
  font-size : 11px;
  color : #666666;
}
input.search_file {
  border : 1px solid #333333;
  font-family : verdana;
  font-size : 10px;
  color : #666666;  
}
 
input.button {
  font-family : verdana;
  font-size : 10px;
  color : #666666;  
}
 
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
 
<script language="JavaScript">
 
var Nb=0; // Cette variable nous permettra de compter le nombre de champs affichés
 
function AjoutFichier(){
 
  var new_file = document.getElementById("search_file").value;
  text = '<li>' + new_file + '</li>';
  var actual_file = document.getElementById("liste_fichiers").innerHTML;
  document.getElementById("liste_fichiers").innerHTML = actual_file + text;
 
  Nb++;
 
  new_champ = "Champ"+Nb;
 
  LeFile=document.getElementById("search_file").cloneNode(true);
  LeFile.name=new_champ;
  LeFile.id=new_champ;
  LeFile.size="100";
  //Lefile.enable="false";
  document.getElementById("liste_fichiers").appendChild(LeFile);
  document.getElementById(new_champ).onchange="";
} 
 
</script>
</head>
<body>
<center>
  <p>
    <b>UPLOAD MULTI-FICHIERS</b>
  </p>
  <table>
  <tr>
  <td align="center">
  sélectionner un fichier : <br />
  <input class="search_file" NAME="search_file" TYPE="file" id="search_file" onChange="AjoutFichier();" size="20"><br>
  </td>
  </tr>
  <tr>
  <td>
  <center>liste des fichiers à transferer :</center>
  <ul>
  <div id="liste_fichiers"></div>
  </ul>
  </td>
  </tr>
  </table>
</center>
</body>
</html>

merci d'avance pour votre aide.