jQuery.ajax()+PHP ファイルアップロード

jQuery.ajax()でファイルをアップロードする方法

HTML

<form name="file" method="post" action="./file_upload.php" enctype="multipart/form-data">
	<input type="file" id="uploader" name="file_data" />
	<p id="uploader-status"></p>
</form>

javascript

function file_upload()
{	
	// 送信先
	var sendUrl = "http://localhost/sample/fileup.php";

	$("#uploader-status").text("");
	var fd = new FormData();
	if ($("#uploader").val()!== ''){
		fd.append("file",$("#uploader").prop("files")[0]);
	}else{
		$("#uploader-status").text("ファイルを選択してください。");
		return;
	}
	var postData = {
		url:sendUrl,
		type:"POST",
		dataType:"text",
		data:fd,
		processData:false,
		contentType:false,
		beforeSend:function(){
			form_disabled(true);
			$("#uploader-status").text("アップロード中…");
		}
	};
	$.ajax(postData).done(function(data){
		form_disabled(false);
		$("#uploader-status").text(data);

		// ファイル選択をクリアする
		$("#uploader").val("");
	}).fail(function(data){
		$("#uploader-status").text("アップロードに失敗しました。");
	});
}

function form_disabled(value)
{			
	$("#uploader").prop("disabled",value);
	$("#upload-btn").prop("disabled",value);
}

PHP

<?php 
$uploadFolder = "./Uploads/";

if (isset($_FILES["file"]["tmp_name"]) && file_exists($_FILES["file"]["tmp_name"]))
{
	// 同名のファイルが存在しているなら、ファイル名の末尾に数字を付ける
	// ファイル名[1].txt
	$nm = $_FILES["file"]["name"];
	$rnm = "";
	if (file_exists($uploadFolder . $nm))
	{
		$i = 1;
		$rnm = $nm;
		while (file_exists($uploadFolder . $rnm))
		{
			$info = pathinfo($nm);
			$rnm = $info["filename"] . "[". $i ."]" . "." . $info["extension"];
			$i++;
		}
	}
	
	// 一時ファイルを保存先に移動
	$uploadPath = $uploadFolder . ($rnm !== "" ? $rnm:$nm);
	// Warningを出力しないようにする
	if (@move_uploaded_file($_FILES["file"]["tmp_name"],$uploadPath) === true)
	{
		echo "アップロードに成功しました。";
		return;
	}	
}
echo "アップロードに失敗しました。";
?>