File "custom_upload03.html"

Full Path: /home/analogde/www/Prog/File explorer/custom_upload03.html
File size: 1.51 KB
MIME-type: text/html
Charset: utf-8

 
Open Edit   Advanced Editor   Back 
<!DOCTYPE html> 
<html> 
<head> 
	<title> 
		Async file upload with jQuery 
	</title> 
	
	<script src= 
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> 
	</script> 
</head> 

<body> 
	<div align="center"> 
		<form method="post" action="" enctype="multipart/form-data"
				id="myform"> 

			<div > 
				<input type="file" id="file" name="file" /> 
				<input type="button" class="button" value="Upload"
						id="but_upload"> 
			</div> 
		</form> 
	</div>	 

	   <!-- Image loader -->
<div id="loader" style="display: none;">
    <img src="wait.gif">
  </div>

  <p id="myElem" style="display:none">Bravo Patrice ...</p>
	
  <p id="user_reponse"></p>

	<script type="text/javascript"> 
		$(document).ready(function() { 
			$("#but_upload").click(function()
			 { 
				var fd = new FormData(); 
				var files = $('#file')[0].files[0]; 
				fd.append('file', files); 
	
				$.ajax({ 
					url: 'envoi-file.php', 
					type: 'post', 
					data: fd, 
					contentType: false, 
					processData: false, 

					beforeSend: function()
           			{
		                $("#loader").show();
						
        		    },
					
					success: function(response){ 
						//if(response != 0){ 
						//alert('file uploaded'); 
						$("#loader").hide();
						$("#myElem").show();

						$('#user_reponse').html( response );

						//} 
						//else{ 
						//	alert('file not uploaded'); 
						//} 
					} ,

				}); 
			}); 
		}); 
	</script> 
</body> 

</html>