How to upload multiple files in php with add and remove options?

Hello, thanks for your questions,
I will show you how to upload multiple files in PHP with add and remove/delete options using PHP, javascript, and jquery. I have generated my personal PHP script which is very easy to understand and setup is also easy for any developers or users. You just need to follow the steps below.

I have fixed the add and delete/remove options also for multiple files upload in PHP. You can see the demo at the bottom of the page. Let’s start the tutorial.

Follow the steps for upload multiple files in php with add and remove options

Step 1: Create one “index.php” file and make one folder named “uploads” in your server
First of all, you need to create one file name “index.php” and create one folder name “uploads”.
Uploads folder is used for store all the uploaded files.

Step 2: Copy the below code and paste in “index.php”
The second step is you just need to copy the below code and paste it in your “index.php” file because This code is created by me and I have used the jquery for add new files and remove/delete selected files.
That’s it you can now execute the code and upload multiple files in PHP with add and remove/delete options using PHP, javascript, and jquery.


<?php

ini_set("error_reporting", 1);

if(isset($_POST['btnSubmit']))

{

for ($i = 0; $i < count($_FILES['files']['name']); $i++)

{

if ($_FILES["files"]["size"][$i] < 1000000) // Check File size (Allow 1MB)

{

$temp = $_FILES["files"]["tmp_name"][$i];

$name = $_FILES["files"]["name"][$i];

if(empty($temp))

{

break;

}

if($i == 0){ $err = "File uploaded successfully"; $cls = "success"; }

move_uploaded_file($temp,"img/".$name);

}

else

{

$err = "File size is more than 1MB";

$cls = "danger";

}

}

}

?>

<html>

<head>

<style>

body{ font-family:sans-serif; }

table, th, td {

border: 1px solid black;

border-collapse: collapse;

}

.success{ color: green;}

.danger{ color: red;}

</style>

</head>

<body>

<center>

<form method='post' enctype='multipart/form-data'>

<table id="table" width="50%">

<thead>

<tr class="text-center">

<th colspan="3" style="height:50px;">Mutiple File Upload Script</th>

</tr>

</thead>

<tbody>

<tr class="add_row">

<td id="no" width="5%">#</td>

<td width="75%"><input class="file" name='files[]' type='file' multiple /></td>

<td width="20%"></td>

</tr>

</tbody>

<tfoot>

<tr>

<td colspan="4">

<button class="btn btn-success btn-sm" type="button" id="add" title='Add new file'/>Add new file</button>

</td>

</tr>

<tr class="last_row">

<td colspan="4" style="text-align:center;">

<button class="btn btn-primary submit" name="btnSubmit" type='submit'>Upload</button>

</td>

</tr>

</tfoot>

</table>

</form>

<br><br><br><br>

<h2 class="<?php echo $cls; ?>"><?php echo $err; ?></h2>

</center>

https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js
$(document).ready(function(){

// Validation

$('.submit').click(function(){

var file_val = $('.file').val();

if(file_val == "")

{

alert("Please select at least one file.");

return false;

}

else{

$('form').attr('action', 'index.php');

}

});
// Append new row

$('#table').on('click', "#add", function(e) {

$('tbody').append('

#


');

e.preventDefault();

});
// Delete row

$('#table').on('click', "#delete", function(e) {

if (!confirm("Are you sure you want to delete this file?"))

return false;

$(this).closest('tr').remove();

e.preventDefault();

});

});
</body>

</html>

I hope you will like this tutorial and enjoyed it. If you have any questions then ask me again.

Popular Topics

How to upload multiple files in php with add and remove options?

Your Answer

Related Questions

TOP USERS

Federal Holiday