通過表單

Question

提交圖像和文本以及進度條我有一個包含圖像和文本的表單，所有這些數據都需要插入到數據庫中。

<form action="processupload.php" method="post" enctype="multipart/form-data" id="UploadForm"> 
    <input name="name" type="text" /> 
    <input name="age" type="text" /> 

    <input name="fileToUpload" type="file" /> 
    <input type="submit" id="SubmitButton" value="Upload" /> 
</form> 

但是我有一個特別的要求，我想，用戶可以填寫所有的細節，但是當他來到上裝部分，我想這樣的

其中

視圖

• 用戶填寫文本字段
• 選擇通過上傳按鈕
• 得到上載的圖像的預覽（如在圖中示出）
• 點擊了開始按鈕的圖像，進度條將開始直到時間圖像被上傳
• 上述步驟被完成之後，用戶會點擊主提交按鈕，然後將整個數據應該去後臺

代碼processupload.php

if (count ($_POST) > 1) 
    { 
     $name = $_POST['name']; 

     $target_dir = "uploads/"; 
     $target_file = $target_dir . basename($_FILES["fileToUpload"]["name"]); 
     $uploadOk = 1; 
     $imageFileType = pathinfo($target_file,PATHINFO_EXTENSION); 
     $new_filename = $target_dir . uniqid() . '.' . $imageFileType; 
     if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $new_filename)) 
      { 
       // do something 
      } 
    } 

用於裝載機的腳本在這裏@fidlde。誰能告訴我怎樣才能實現這一功能

腳本

$(document).ready(function() { 
    var progressbox  = $('#progressbox'); 
    var progressbar  = $('#progressbar'); 
    var statustxt  = $('#statustxt'); 
    var submitbutton = $("#SubmitButton"); 
    var myform   = $("#UploadForm"); 
    var output   = $("#output"); 
    var completed  = '0%'; 
    $(myform).ajaxForm({ 
     beforeSend: function() { //brfore sending form 
      submitbutton.attr('disabled', ''); // disable upload button 
      statustxt.empty(); 
      progressbox.slideDown(); //show progressbar 
      progressbar.width(completed); //initial value 0% of progressbar 
      statustxt.html(completed); //set status text 
      statustxt.css('color','#000'); //initial color of status text 
     }, 
     uploadProgress: function(event, position, total, percentComplete) { //on progress 
      progressbar.width(percentComplete + '%') //update progressbar percent complete 
      statustxt.html(percentComplete + '%'); //update status text 
      if(percentComplete>50) 
       { 
        statustxt.css('color','#fff'); //change status text to white after 50% 
       } 
      }, 
     complete: function(response) { // on complete 
      output.html(response.responseText); //update element with received data 
      myform.resetForm(); // reset form 
      submitbutton.removeAttr('disabled'); //enable submit button 
      progressbox.slideUp(); // hide progressbar 
     } 
    }); 
}); 

Answer 1

我希望你明白，isset($_POST)總是返回true，因爲它是一個超級全局和你不應該檢查這個方式。這將是明智的，而不是檢查：

if (count ($_POST) > 1) 

當你有兩個<inputs />，這將是一個更好的選擇，以檢查是否輸入已被輸入。點擊取消，將不是停止上傳過程，因爲它是一個單一的請求發送，AFAIK。