Wednesday, March 14, 2012

Multiple files Upload in PHP

Paste the Html code in html page, create one more php page called upload.php
HTML Code :
<html>
<head>
<title>Upload Multiple Files</title>
<script>
var rowid=0;
function addTableRow()
{
var div = document.createElement(‘DIV’);
div.className = “rowdiv”;
div.id = ‘dynamicRow’+(rowid++);
div.name = ‘dynamicRow[]‘;
div.innerHTML = ‘<div>’+
//File name column
‘<div>’+
‘<table border=”0″>’+
‘<tr>’+
‘<td>Image Caption</td>’+
‘<td><input type=”text” name=”image_caption[]” id=”image_caption’+rowid+’”  /></td>’+
‘</tr><tr><td>Upload Image</td>’+
//Browse button
‘<td ><div id=”ufile_field’+rowid+’”>’+
‘imagepath[]” id=”imagepath’+rowid+’”  />’+
‘</div>’+
‘rowid-1)+’)” value=”Remove” style=”color:#009999;border:0px;background:transparent;cursor:pointer;”>’+
‘</td></tr>’+
‘</table></div>’+
‘</div>’;
document.getElementById(‘dynamicTable’).appendChild(div);
}
function deleteItem(id)
{
document.getElementById(‘dynamicTable’).removeChild(document.getElementById(‘dynamicRow’+id));
}
function do_submit(f){
var chk = false;
text_array = document.getElementsByName(‘image_caption[]‘);
var number_text_rows = text_array.length;
for(var k=0;k<text_array.length;k++){
text_value = text_array[k].value;
if(text_value == “”){
alert(“Please enter image caption”);
return false;
}
}
files_array = document.getElementsByName(‘imagepath[]‘);
var number_rows = files_array.length;
for (var i=0;i<files_array.length;i++){
filename = files_array[i].value;
if(filename != ”){
var lastDot = filename.lastIndexOf(“.”);
var pathLength = filename.length;
var fileType = filename.substring(lastDot,pathLength);
if((fileType == “.jpg”) || (fileType == “.gif”) || (fileType == “.png”)) {
chk = true;
} else {
alert(“Invalid file format.”);
return false;
}
}else{
var img_cnt = i + 1;
alert(“Please Upload for Image. “+ img_cnt);
return false;
}
}
if (chk == true)
return true;
}
</script>
</head>
<body style=”text-align: center;”>
<form enctype=”multipart/form-data” action=”upload.php” method=”post” onSubmit=”return do_submit(this)” enctype=”multipart/form-data”>
<table>
<tr>
<td>Image Caption</td>
<td><input type=”text” name=”image_caption[]” id=”image_caption” /></td>
</tr>
<tr>
<td>Upload Image</td>
<td>
imagepath[]” id=”imagepath” />
<a href=”javascript://” onclick=”addTableRow();”>Attach a file</a>
</td>
</tr>
</table>
<table>
dynamicTable”>
</table>
<input type=”submit” name=”upload” value=”Upload” />
</form>
</body>
</html>

PHP Code :
<?php
$files = $_FILES['imagepath'];
$number_of_files = count(reArrayFiles($files));
$files_arr = reArrayFiles($files);
echo “<pre>”;
print_r($files_arr);
function reArrayFiles(&$file_post)
{
if (is_array($file_post['name'])) {
$file_ary = array();
$file_count = count($file_post['name']);
$file_keys = array_keys($file_post);
for ($i=0; $i<$file_count; $i++) {
foreach ($file_keys as $key) {
$file_ary[$i][$key] = $file_post[$key][$i];
}
}
}else {
$file_ary[0] = $file_post;
}
return $file_ary;
}
?>

No comments:

Post a Comment