Upload un fichier sur un serveur

**xxloubexx** · 03/05/2019, 22h21

Bonjour,
j'essaie de créer un site internet où je pourrai envoyer des fichiers par "drag & drop" mais je n'y arrive pas. Serait-il possible que vous m'aidiez ?

Code:

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
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
<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Page Upload</title>
		<link rel="stylesheet" href="css/global.css">
	</head>
	<body>
		<div class="dropzone" id="dropzone">Glissez le fichier que vous voulez upload sur le serveur</div>
		<div id="uploads"></div>
		<script>
                        (function dropzone(typeof !== 'undefined') {
                                var dropzone = document.getElementById('dropzone');
                                
                                var displayUploads = function(data) {
                                        var uploads = document.getElementById('uploads'),
                                                anchor,
                                                x;
                                        
                                        for(x = 0; x < data.lenght; x = x +1) {
                                                anchor = document.createElement('a');
                                                anchor.href = data[x].file;
                                                anchor.innerText = data[x].name;
                                                
                                                uploads.appendChild(anchor);
                                        }
                                }
                                
                                var upload = function(files) {
                                        var formData = new FormData(),
                                        xhr = new XMLHttpRequest(),
                                        x;
                                        
                                        for(x = 0; x < files.lenght; x + 1) {
                                                formData.append('file[]', files[x]);
                                        }
                                        
                                        xhr.onload = function() {
                                                var data = this.responseText;
                                                var data = JSON.parse(this.responseText);
                                                
                                                displayUploads(data);
                                        }
                                        
                                        xhr.open('post', 'upload.php');
                                        xhr.send(formData);
                                }
                                
                                
                                dropzone.ondrop(typeof dropzone.ondrop !== 'undefined') = function(e) {
                                        e.preventDefault();
                                        this.className = 'dropzone';
                                        upload(e.dataTransfer.files);
                                };
                                
                                
                                drop.ondragover(typeof dropzone.ondragover !== 'undefined') = function() {
                                        this.className = 'dropzone dragover';
                                        return false;
                                };
                                
                                
                                drop.ondragleave(typeof dropzone.ondragleave !== 'undefined') = function() {
                                        this.className = 'dropzone';
                                        return false;
                                }
                        });
                </script>
	</body>
</html>

Cordialement,
xxloubexx.

**Watilin** · 04/05/2019, 23h04

Il y a des problèmes de syntaxe un peu partout.

D’abord, ces parenthèses avec des tests typeof qui semblent avoir été saupoudrés au hasard dans le code ;
Les boucles for qui ont tantôt une instruction x = x + 1, tantôt seulement x + 1 (il manque le = et ça fait une boucle infinie) ;
Les lenght au lieu de length

Utilise le mode strict et la console F12 pour t’aider à développer.

**xxloubexx** · 04/05/2019, 23h06

D'accord merci. J'essayerai de corriger cela.

Cordialement,
xxloubexx.

Upload un fichier sur un serveur

AJAX

Vue hybride

Discussions similaires

Partager

Partager