2017-02-24 21 views
0

如何從形式門就像書名id:bname文本添加到將其發送到upload.php頁面的請求,以及如何我可以收到upload.php頁面的文字。如何發送文本輸入與文件上傳在Ajax請求upload.php的以及如何接收

function uploadFile(){  
    var file = document.getElementById("upload").files[0]; 
    var formdata = new FormData(); 
    formdata.append("upload", file);  
    var ajax = new XMLHttpRequest(); 
    ajax.upload.addEventListener("progress", progressHandler, false); 
    ajax.addEventListener("load", completeHandler, false); 
    ajax.addEventListener("error", errorHandler, false); 
    ajax.addEventListener("abort", abortHandler, false); 
    ajax.open("POST", "upload.php"); 
    ajax.send(formdata); 
    clikedbtn(); 
} 

功能在上傳文件

function progressHandler(event){ 
    var percent = (event.loaded/event.total) * 100; 
    document.getElementById("progressBar").value = Math.round(percent); 

}  
function completeHandler(event){ 
    document.getElementById("progressBar").value = 0; 
} 
function errorHandler(event){} 
function abortHandler(event){} 
function clikedbtn(){} 

html標籤

<form method="post" enctype="multipart/form-data"> 
    <label for="bname">book name</label> 
    <input name="bname" id="sname" type="text"> 
    <label for="dbname">bood desc</label> 
    <input name="dbname" id="dbname" type="text"> 
    <input id="upload" name="upload" type="file"> 
    <input id="btnupload" type="button" value="add" onclick="uploadFile() "> 
</form> 

upload.php的
我想用我會在這個頁面

<?php 
$fileName = $_FILES["upload"]["name"]; 
$fileTmpLoc = $_FILES["upload"]["tmp_name"]; 
$fileType = $_FILES["upload"]["type"]; 
$fileSize = $_FILES["upload"]["size"]; 
$fileErrorMsg = $_FILES["upload"]["error"]; 

if (!$fileTmpLoc) { // if file not chosen 
echo "ERROR: Please browse for a file before clicking the upload button."; 
exit(); 
} 
if(move_uploaded_file($fileTmpLoc, "upload/$fileName")){ 
echo "$fileName upload is complete"; 

} else { 
echo "move_uploaded_file function failed"; 
} 

?> 
發送文本

回答

0

用於接收響應:

var ajax = new XMLHttpRequest();// under this line 
    ajax.onreadystatechange = function() { 
     if (ajax.readyState === XMLHttpRequest.DONE && ajax.status === 200) { 
      // you can hanle ajx.responseText 
     } 
    }; 
相關問題