Tiny File Manager

Back Back Up Advanced Editor

<div id="file_count"></div>
	
	
	<form id="form_transfert_fichier" name="form_transfert_fichier" enctype="multipart/form-data">
	
		<input type="file" id="uploadFile" name="fichiers_transfert[]" multiple="multiple" />
	
	
		<br>
		<br>
		<button onclick="uploadFiles()">Upload</button> 				
		
		
		
		<input type="button" value="Envoi" onclick="debug_bis()" /> 
	
	</form>
	
	<div id="upload_prev"></div>

<div id="server_response">Pas de réponse du serveur</div>

<style>

input[type="file"] {
width:100px;
overflow: hidden;
}

.filenameupload {
  width: 98%;
}

#upload_prev {
  border: thin solid #000;
  width: 65%;
  padding: 0.5em 1em 1.5em 1em;
}

#upload_prev span {
  display: flex;
  padding: 0 5px;
  font-size: 12px;
}

</style>

var showFileCount = function() {  $('#file_count').text('# Files selected: ' + fileCount);
};

showFileCount();

$(document).on('click', '.close', function() 
	{
		$(this).parents('span').remove();
		fileCount -= 1;
		showFileCount();
	})

$('#uploadFile').on('change', function() 
	{

var filename = this.value;
		var lastIndex = filename.lastIndexOf("\\");
		if (lastIndex >= 0) 
		{
			filename = filename.substring(lastIndex + 1);
		}
  
		var files = $('#uploadFile')[0].files;
		
		for (var i = 0; i < files.length; i++) 
		{
			$("#upload_prev").append('<span>' + '<div class="filenameupload">' + files[i].name + '</div>' + '<p class="close" >X</p></span>');
		}
  
		fileCount += files.length;
		showFileCount();
	});

</script>