需要的文件上傳進度條

我需要在使用嵌入式Microchip TCP/IP協議棧Pic32板卡的客戶端的網頁界面上顯示上傳進度指示器。在網頁中，我有一個上傳文件頁面，讓客戶端瀏覽並選擇合適的.hex或.wav文件上傳到電路板存儲器，從而最終引導該文件。我的問題是，當文件上傳時，客戶端不知道文件正在製作的進度，並可能從該頁面導航，從而取消下載。我需要一個指示器來顯示上傳進度，以便讓客戶瞭解情況。請記住，我有5個上傳框用於需要上傳的不同實例。我一次只允許1次上傳。需要的文件上傳進度條

這裏是HTML部分代碼：我有可用的Microchip的customHTTPApp.c代碼

<table width="900" border="0" cellpadding="1" class="uploadTable"> 
     <tr> 
     <td width="420" rowspan="2"><form action="fileupload.html" method="post" enctype="multipart/form-data"> 
      <div class="uploadBox"> 
      <p><b>Update Primary System Firmware</b></p> 
      <p>File: 
       <input type="file" name="firmwaremain" size="30" /> 
       &nbsp; 
       <input type="submit" value="Upload" /> 
      </p> 
      </div> 
     </form></td> 
     <td width="252" height="23"><div align="center"><strong>Current File Name: </strong></div></td> 
     <td width="104"><div align="center"><strong>Current File Size:</strong></div> </td> 
     <td width="104"><div align="center"><strong>File Upload Date:</strong></div></td> 
     </tr> 
     <tr> 
     <td height="40"><div align="center">~curFirmName~</div></td> 
     <td width="104"><div align="center">~curFirmSize~</div></td> 
     <td width="104"><div align="center">~curFirmDate~</div></td> 
     </tr> 
    </table>

，但實在是太繁瑣，張貼在這裏。

我可以根據需要發送電子郵件或聊天。我沒有發佈圖片的代表，而我的Web界面網站位於獨立主板中，因此沒有鏈接。

非常感謝您的幫助！

-Josh

來源

2012-02-10 Josh C

老實說，我不知道微芯片了，但也許NeatUpload可以給你一些提示？ – Remy 2012-02-10 21:31:02

隨意發表評論中的圖像鏈接;如果它們看起來很有用，那麼某種高級代表用戶會爲他們內聯。 – sarnold 2012-02-10 22:52:27

基本輪廓/主意：

使用JavaScript超時輪詢URL每隔N秒：setTimeout(1000*N), "getProgress()");。這是從平變化要求您type="file"input標籤
你的JS getProgress功能使一個Ajax請求的URL：http//localhost/uploadProgress
你的JS getProgress功能也本身（相同的代碼）setTimeout的再次呼籲，如果文件未完成上傳。
你的進步URL返回百分比當前上傳文件進步（字節吧？）作爲一個JSON字符串：{進展：「50」}
有N個像素的DIV寬度id="progress-complete"和嵌套DIV id="progress"與寬度等於您的阿賈克斯電話所返回的百分比值

讓我知道如果我可以擴展，如果它有幫助。我只是在需要某處開始使用的情況下發布此信息。

來源

2012-02-10 22:53:00 Matthew

每個項目符號點都可能是單獨的問題，您可以通過搜索/詢問找到Stack Overflow的答案。 – Matthew 2012-02-10 22:56:07

謝謝馬修，這很有幫助，我很欣賞評論！ – 2012-02-13 15:23:26

不客氣。祝你好運。 – Matthew 2012-02-14 00:19:15

需要的文件上傳進度條

回答

相關問題