2010-02-20 41 views
7

tôi gặp sự cố với plugin dạng jquery. Tôi cố tải lên tệp không đồng bộ nhưng không gửi biểu mẫu. mã đánh dấu html và mã javascript giống như bên dướiTải tệp jquery dạng tệp lên

<form id="fileUploadForm" method="post" action="Default.aspx" enctype="multipart/form-data"> 
<input type="text" name="filename" /> 
<input type="file" id="postedFile" name="postedFile" /> 
<input type="button" value="Submit" onclick="UploadFile();" /> 
</form> 

$(document).ready(function() { 

     $('#fileUploadForm').ajaxForm();    
    }); 

function UploadFile() { 

     var options = 
     {     
      url:"Default.aspx",     
      beforeSend: ShowRequest, 
      success: SubmitSuccesfull, 
      error:AjaxError        
     };    
     $("#fileUploadForm").ajaxSubmit(options); 
     return false; 
    }. 

Tôi có một mẫu kiểm tra khác chỉ có hộp văn bản trong đó và nó hoạt động tốt. Ngoài ra khi tôi nhận xét các loại đầu vào = "file" ... dòng ở trên hình thức hoạt động tốt quá. Vấn đề với tệp kiểu đầu vào là gì? Bất kỳ ý tưởng nào?

Trả lời

8

Nói tóm lại:

<input type="file" /> 

Không thể được gửi qua ajax, nó có phải là một postback đầy đủ. Theo truyền thống, bạn sử dụng iFrame cho điều này nếu bạn muốn có hành vi kiểu AJAX. Tôi đã sử dụng một vài giải pháp cho điều này, mà không biết bạn đang ở trên nền tảng nào, SWFUpload thường là một lựa chọn tốt.

Dưới đây là một ví dụ tài liệu đầy đủ của một sửa chữa:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
    <script type="text/javascript" src="Javascript/jquery-1.3.2.js"></script> 
    <script type="text/javascript" src="Javascript/jquery.form.js"></script> 
    <script type="text/javascript"> 
     $(function() {    
      $('#fileUploadForm').ajaxForm({     
      beforeSubmit: ShowRequest, 
      success: SubmitSuccesful, 
      error: AjaxError        
      });          
     });    

     function ShowRequest(formData, jqForm, options) { 
      var queryString = $.param(formData); 
      alert('BeforeSend method: \n\nAbout to submit: \n\n' + queryString); 
      return true; 
     } 

     function AjaxError() { 
      alert("An AJAX error occured."); 
     } 

     function SubmitSuccesful(responseText, statusText) {   
      alert("SuccesMethod:\n\n" + responseText); 
     }  
    </script> 
</head> 
<body> 
    <form id="fileUploadForm" method="POST" action="Default.aspx" enctype="multipart/form-data"> 
     <input type="text" name="filename" /> 
     <input type="file" id="postedFile" name="postedFile" /> 
     <input type="submit" value="Submit" /> 
    </form> 
</body> 
</html> 
+2

Cảm ơn phản hồi của bạn bạn có thể kiểm tra các liên kết dưới đây http://jquery.malsup.com/form/#file-upload am tôi hiểu lầm nó? – mehmet6parmak

+0

@ mehmet6parmak - Đã thêm thay thế ở trên, cho nó một shot, xem nếu bạn vẫn còn có vấn đề. Bạn đang sử dụng FireBug hoặc một cái gì đó để xem có hành động/lỗi nào đang diễn ra không? –

+0

tôi không sử dụng firebug nhưng tôi gỡ lỗi nó trong studio trực quan tuy nhiên tôi không thể hiểu những gì đang xảy ra bên trong jquery (thực sự như bạn đã đề cập ở trên nó tạo ra một iframe thats điều duy nhất tôi hiểu =)). nhưng phương pháp đó không bao giờ được thực hiện. Nếu tôi tìm thấy vấn đề tôi sẽ viết nó ở đây nhờ một lần nữa cho sự quan tâm của bạn. – mehmet6parmak

Các vấn đề liên quan