如何在上傳文件時將數據發送到服務器？

Question

當用戶上傳圖片到服務器時，圖片必須像pkUsre.extention，exemple 1.jpg那樣存儲，其中數字1是用戶主鍵。 我有以下代碼工作正常，上傳文件，但我不知道如何發送pkUser到圖片的服務器。任何想法如何做到這一點？

//Html code 
    <form id="form1" enctype="multipart/form-data" method="post" > 
    <div class="row"> 
     <input type="file" name="fileToUpload" id="fileToUpload" onchange="fileSelected();"/> 
    </div> 
    <div id="fileName"></div> 
    <div id="fileSize"></div> 
    <div id="fileType"></div> 
    <div class="row"> 
     <input type="button" id="btnSd" value="Upload" /> 
    </div> 
    <div id="progressNumber"></div> 
    </form> 

//PHP code 
    if (move_uploaded_file($_FILES['fileToUpload']['tmp_name'], "pic/".  basename($_FILES['fileToUpload']['name']))) { 
     echo basename($_FILES['fileToUpload']['name']); 
    } 
    else { 
     echo "There was a problem uploading your file - please try again."; 
    } 

//Javascript code 
    <script type="text/javascript"> 
     function fileSelected() { 
     var file = document.getElementById('fileToUpload').files[0]; 
     if (file) { 
      var fileSize = 0; 
      if (file.size > 1024 * 1024) 
      fileSize = (Math.round(file.size * 100/(1024 * 1024))/100).toString() + 'MB'; 
      else 
      fileSize = (Math.round(file.size * 100/1024)/100).toString() + 'KB'; 

      document.getElementById('fileName').innerHTML = 'Name: ' + file.name; 
      document.getElementById('fileSize').innerHTML = 'Size: ' + fileSize; 
      document.getElementById('fileType').innerHTML = 'Type: ' + file.type; 
     } 
     } 

     function uploadFile() { 
     var fd = new FormData(); 
     fd.append("fileToUpload", document.getElementById('fileToUpload').files[0]); 
     var xhr = new XMLHttpRequest(); 
     xhr.upload.addEventListener("progress", uploadProgress, false); 
     xhr.addEventListener("load", uploadComplete, false); 
     xhr.addEventListener("error", uploadFailed, false); 
     xhr.addEventListener("abort", uploadCanceled, false); 
     xhr.open("POST", "uploadFoto.php"); 
     xhr.send(fd); 
     } 

     function uploadProgress(evt) { 
     if (evt.lengthComputable) { 
      var percentComplete = Math.round(evt.loaded * 100/evt.total); 
      document.getElementById('progressNumber').innerHTML = percentComplete.toString() + '%'; 
     } 
     else { 
      document.getElementById('progressNumber').innerHTML = 'unable to compute'; 
     } 
     } 

     function uploadComplete(evt) { 
     /* This event is raised when the server send back a response */ 
     alert(evt.target.responseText); 
     } 

     function uploadFailed(evt) { 
     alert("There was an error attempting to upload the file."); 
     } 

     function uploadCanceled(evt) { 
     alert("The upload has been canceled by the user or the browser dropped the connection."); 
     } 
    </script> 
    <script type="text/javascript"> 
     $(document).on("click", "#btnSd", function(){ 
      uploadFile();  
     });  
    </script> 

Answer 1

最後，我開發的解決方案。

1. 將「fileUpload」類添加到將保存要上載的文件的輸入元素。
2. 設置一個id爲something-pkUser。我坐在ID =「fileUpload-1」動態創建惠普PHP。
3. 對上面的JavaScript代碼做一點改動。轉到函數uploadFile（）並創建一個參數「n」。它會像那個uploadFile（n）。

4. 在這個函數中，轉到fd.append（...，...）部分，併爲您創建的「n」更改第一個第二個參數'fileToUpload'。您將有以下：

   fd.append（「fileToUpload」，document.getElementById（'fileToUpload'）。files [0]）;

這個改變：

fd.append(n, document.getElementById(n).files[0]); 

現在你必須改變jQuery代碼：

是之前：

$(document).on("click", "#btnSd", function(){ 
     uploadFile();  
    }); 

現在會是這樣的：

$(document).on("click", "#btnSd", function(){ 
     uploadFile($(".fileToUpload").attr('id'));  
    }); 

最後，ajax會發送數據到服務器。我們可以用php substrigs函數清除字符串。這是我的解決方案：

foreach ($_FILES as $key => $value) { 
$arrFile = $key;       
$pkUser = substr($arrFile,(int)$pos=strpos($arrFile, "-")+1);  
$filename=$_FILES[$arrFile]['name']; 
$ext = substr($filename,strpos($filename, ".")); 
} 

$finalName=$pkUser.$ext; 

    if (move_uploaded_file($_FILES[$arrFile]['tmp_name'], "pic/".$finalName)) { 
     echo $finalName; 
    } 
    else { 
     echo "There was a problem uploading your file - please try again."; 
    }  

最後這個作品很好！我可以發送用戶的主鍵並按需要存儲。

Answer 2

only file uplod name in server database and move to file in folder user_post. 
    file copy in filder and only name is database save. 


    function getuniqkey($special='') 
     { 
      return md5(date("Y-m-d H:i:s").uniqid(rand(), true).time().$special); 
     } 
    if(isset($_FILES["fileToUpload"])) 
     { 
      $tmp_name = $_FILES["fileToUpload"]["tmp_name"]; 
      $name1 = $_FILES["fileToUpload"]["name"];  
      $datasheet_new_name=getuniqkey($tmp_name).substr($name1,strrpos($name1,".")); 
      if(copy($_FILES["fileToUpload"]["tmp_name"], "user_post/".$datasheet_new_name)) 
      { 
       $file_name = "http://domain name.com/user_post/{$datasheet_new_name}"; 
      } 
      else 
      { 
       echo'user file not upload.'; 


      } 

    }   
    echo $file_name;