Ajax PHP 

PHP with Ajax multiple file upload

Please go through the following steps to implement PHP with Ajax multiple file upload.

Step 1: Create a file called index.php and add below codes

<title>AJAX Multi Images Upload in PHP </title>

<script src="https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function (e) {
	$("#imguploadform").on('submit',(function(e) {
        	url: "upload.php",
			type: "POST",
			data:  new FormData(this),
			contentType: false,
    	    cache: false,
			success: function(data){
		  	error: function(){} 	        
<div class="gallery-bg">
<form id="imguploadform" action="upload.php" method="post">
<div id="gallery"></div>
<div id="uploadFormLayer">
<p class="txt-subtitle">Select Multiple Files:</p>
<p><input name="userImage[]" type="file" multiple/><p><!-- 
<p><input name="userImage[]" type="file"/><p>
<p><input name="userImage[]" type="file"/><p> -->
<p><input type="submit" value="Submit" class="btnUpload" /><p>

Step 2: First create folder called “images”, and then create 2nd file  called upload.php

if(is_array($_FILES)) {
	foreach ($_FILES['userImage']['name'] as $name => $value){
		if(is_uploaded_file($_FILES['userImage']['tmp_name'][$name])) {
		$sourcePath = $_FILES['userImage']['tmp_name'][$name];
		$targetPath = "images/".$_FILES['userImage']['name'][$name];
			if(move_uploaded_file($sourcePath,$targetPath)) {
	echo "Upload Successfull";

Click here for github file Repository

Arjun is is a web developer/designer, who is fond of the web. He lives in Manipal, Karnataka, India.

Also Read:  How To Install Linux, Apache, MySQL, PHP (LAMP) stack on AWS Ubuntu

Related posts