Multiple Image Uploader

Hello guys,

Today i need to develop Multiple Image Uploader for my project purpose, so first i searched on Google and i also got so many widgets, but all widget have heavy coding which is not easy to understand. so i thought let’s develop it with my own logic and i did it.!


I used JQuery and HTML and PHP for this small widget. don’t worry this is very simple and easy to understand. 🙂

so let’s Go For CodinG…..!


<title>Image Uploader</title>
<script src="jquery.js"> </script>
var i=0;
$("#file").append("<input type='file' name='file"+i+"'><br>");
<div style="border:2px solid blue; width:550px;">
<form method="post" action="uploadarticle.php" enctype="multipart/form-data">
<input type="hidden" name="count" id="count">
<table border="0">
<td> <b>Upload Image here </b></td>
<td> <input type="file" name="file0"> </td><td> <img src="zoomin1.png" width="35" heigth="35" id="add"> </td>
<td> &nbsp;&nbsp;&nbsp;&nbsp;<input type="submit" value="upload"> </td>
<div id="file"></div>


$count = $_POST["count"];
    if ($_FILES["file".$i]["error"] > 0)
         echo "Error: " . $_FILES["file".$i]["error"] . "<br />";
      move_uploaded_file($_FILES["file".$i]["tmp_name"],"upload/" .      $_FILES["file".$i]["name"] );
     echo "<script>alert('IMAGE uploaded successfully')</script>";


  • Create directory with name upload to run this widget.
  • and you must have jquery.js file inside your current directory.
  • put bellow image in your current directory. or you can also place your image if u don’t like mine . :/



Hope you like my widget.!!


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s