Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Code Block
languagejs
titleform.html
<!-- multiple file uploading example by Chun Kang -->
<html>
<head>
	<title>PHP upload file demo</title>
</head>
<script>
function _(el)
{
    return document.getElementById(el);
}

function formatNumber(num) {
  return num.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1,')
}

var upload_index=0;
var upload_obj_id;
var upload_filename;

function completeCTHandler(event)
{
//	_(upload_obj_id).innerHTML = event.target.responseText;
	uploadFiles(upload_index);
}

function progressCTHandler(event)
{
	if (event.lengthComputable)
	{
		var percentage = Math.round(event.loaded/event.total*100);
		_(upload_obj_id).innerHTML
			= upload_filename + " - " + formatNumber(event.loaded) + "/" + formatNumber(event.total) + " bytes uploaded (" + percentage.toString() + "%)<br>" 
			+  "<progress id=\"progressBar\" value=\"" + percentage.toString() + "\" max=\"100\"></progress><br>";
			
	}
}

function uploadFiles(i)
{
	if (!i)
	{
		_("upload_form").style.display = "none";
		_("upload_info").innerHTML = "";
	}
	upload_index=i;

	// var file = _("customthumbnail").files[0];
	total_files = _("files").files.length;
	if (i<total_files)
	{
		upload_index++;
		upload_obj_id = "upload_info" + upload_index.toString();
		upload_filename = _("files").files[i].name;
		_("upload_info").innerHTML += "<div id=\"" + upload_obj_id + "\"></div>";

		var formdata = new FormData();
		formdata.append("whoami", "CK");
		formdata.append("files[]", _("files").files[i]);

		var ajax = new XMLHttpRequest();
		ajax.addEventListener("load", completeCTHandler, false);
		ajax.upload.addEventListener("progress", progressCTHandler, false);
		ajax.open("POST", "submit_upload.php");
		ajax.send(formdata);
	}
}
</script>
<body>
<div id="upload_form">
<form method="post" enctype="multipart/form-data" name="formUploadFile">
	<label>Select files to upload:</label>
	<input type="file" id="files" name="files[]" multiple="multiple" />
	<input type="button" value="Upload File" onClick="uploadFiles(0)"/>
</form>
</div>
<div id="upload_info"></div>
</body>
</html>

...

Code Block
languagephp
titlesubmit_upload.php
<?php
/* Programmed by Chun Kang <http://qsok.com>
 *  
 * @file submit_upload.php
 * @author Chun Kang (ck@qsok.com)
 * 
**/

if(isset($_POST["whoami"]))
{
	$errors = array();
	$uploadedFiles = array();
	$UploadFolder = "/your/upload/path";
				
	$counter = 0;

	/*
		
		$_FILES["files"] Array
		(
		    [name] => Array
		        (
		            [0] => channel_representative_image_BilliadsTV_1920x1080.jpg
		            [1] => channel_representative_image_honey_1920x1080.jpeg
		            [2] => channel_representative_image_idap_1920x1080.jpeg
		            [3] => channel_representative_image_mubeat_1920x1080.jpg
		            [4] => channel_representative_image_muKbang_1920x1080.jpg
		        )

		    [type] => Array
		        (
		            [0] => image/jpeg
		            [1] => image/jpeg
		            [2] => image/jpeg
		            [3] => image/jpeg
		            [4] => image/jpeg
		        )

		    [tmp_name] => Array
		        (
		            [0] => /tmp/php4Mfw5C
		            [1] => /tmp/phpfSF3XV
		            [2] => /tmp/phpyzCFEf
		            [3] => /tmp/phpDRHBnz
		            [4] => /tmp/phpSzSCaT
		        )

		    [error] => Array
		        (
		            [0] => 0
		            [1] => 0
		            [2] => 0
		            [3] => 0
		            [4] => 0
		        )

		    [size] => Array
		        (
		            [0] => 1707487
		            [1] => 2494888
		            [2] => 1327434
		            [3] => 1912188
		            [4] => 1806818
		        )

		)
	*/				

	foreach($_FILES["files"]["tmp_name"] as $i=>$tmp_name)
	{
		$temp = $_FILES["files"]["tmp_name"][$i];
		$name = $_FILES["files"]["name"][$i];
					
		if(empty($temp))
		{
			break;
		}
					
		$counter++;
		$UploadOk = true;

					
		if(file_exists($UploadFolder."/".$name) == true)
		{
			$UploadOk = false;
			array_push($errors, $name." file is already exist.");
		}
					
		if($UploadOk == true)
		{
			if (!file_exists($UploadFolder)) mkdir($UploadFolder);
			move_uploaded_file($temp, $UploadFolder."/".$name);
			array_push($uploadedFiles, $name);
		}
	}
				
	if($counter>0)
	{
		if(count($errors)>0)
		{
			echo "<b>Errors:</b>";
			echo "<br/><ul>";
			foreach($errors as $error)
			{
				echo "<li>".$error."</li>";
			}
			echo "</ul><br/>";
		}
					
		if(count($uploadedFiles)>0)
		{
			echo "<b>Uploaded Files:</b>";
			echo "<br/><ul>";
			foreach($uploadedFiles as $fileName)
			{
				echo "<li>".$fileName."</li>";
			}
			echo "</ul><br/>";
			
			echo count($uploadedFiles)." file(s) are successfully uploaded.";
		}								
	}
	else
	{
		echo "Please, Select file(s) to upload.";
	}
}
?>

...