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:  Google API to Calculate a Distance in PHP / Mysql

Related posts