Discussion :

[tjoce05]

Bonjour

J'ai un input file "multiple" qui me permet d'uploader plusieurs fichiers, mais comment les supprimer en local en cliquant par exemple sur un bouton "remove" avant d'effectuer un upload ?

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
function handleFileSelect(evt) {
	var files = evt.target.files; // FileList object
	// Loop through the FileList and render image files as thumbnails.
	for (var i = 0, f; f = files[i]; i++) {
		// Only process image files.
		if (!f.type.match('image.*')) {
			continue;
		}
		var reader = new FileReader();
		// Closure to capture the file information.
		reader.onload = (function(theFile) {
			return function(e) {
				// Render thumbnail.
				var span = document.createElement('span');
				span.innerHTML = ['<div style="display:inline-block; width:200px; height:220px; line-height: 220px; vertical-align:top; border:1px solid #CCCCCC; text-align:center; margin: 10px 10px 10px 10px; padding: 5px 5px 5px 5px; box-shadow: 5px 5px 8px #aaa;"><p><img class="thumb" src="', e.target.result, '" title="', 
				escape(theFile.name), '" width="150px"/></p><p><a href="#" title="Supprimer" id="deleteFiles"><input type="hidden" value="fileName" name="fileName" class="fileName"><span class="heydings_icons_3" style="float:right;">X</span></a></p></div>'].join('');
				document.getElementById('list').insertBefore(span, null);
			};
		})(f);
		// Read in the image file as a data URL.
		reader.readAsDataURL(f);
	}
}
document.getElementById('files').addEventListener('change', handleFileSelect, false);
$("#files").change(function(){
        var fileName = $("#fileName").val();
	alert(fileName);
});

Merci

[SpaceFrog]

Supprimer des fichiers en local ... avec javascript ?
J'imagine bien la faille de sécurité ^^

[ABCIWEB]

Salut,

Si tu parles de supprimer un fichier de la liste des fichiers à uploader, il faut créer un évènement onclick sur chaque bouton et intégrer cet évènement dans ton processus d'upload pour que le fichier correspondant soit ignoré.

Cette classe d'upload intègre cette fonctionnalité et bien d'autres en option : retour d'informations en temps réel, possibilité de reprendre un upload interrompu, surpasse les configurations serveur, etc. Elle est fournie dans un dossier de test pré configuré et prêt à l'emploi donc il te faudra moins de cinq minutes pour la tester si cela t'intéresse.