2010-02-20 4 views
7

jquery 양식 플러그인에 문제가 있습니다. 파일을 비동기 적으로 업로드하려고 시도하지만 양식을 제출하지 않습니다.Jquery 양식 플러그인 파일 업로드

<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; 
    }. 

아래에 내가 다른 테스트가 그것에서만 텍스트 상자를 가지고 형성이 같은 HTML 태그와 자바 스크립트 코드가 있고 그것을 잘 작동합니다. 또한 내가 입력 형식 = "파일"... 주석 위의 양식을 너무 잘 작동합니다 주석. 입력 파일의 문제점은 무엇입니까? 아이디어가 있으십니까? 한마디로

답변

8

:

<input type="file" /> 

가 아약스를 통해 제출할 수 없습니다, 그것은 전체 포스트 백 수있다. 전통적으로 AJAX 스타일 동작을 원할 경우 iFrame을 사용합니다. 저는 여러분이 어떤 플랫폼을 사용하고 있는지 알지 못하는 가운데 몇 가지 해결책을 사용했습니다. 보통 SWFUpload이 좋은 선택입니다.

<!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

감사 당신이 http://jquery.malsup.com/form/#file-upload 오전 아래의 링크를 확인할 수 있습니다 귀하의 응답 : 여기

는 수정의 전체 문서 예제 나는 그것을 오해하고 있는가? – mehmet6parmak

+0

@ mehmet6parmak - 위의 대안을 추가했습니다. 문제가 여전히 남아 있는지 한번 확인해보십시오. 어떤 조치/오류가 발생했는지 FireBug 또는 다른 것을 사용하고 있습니까? –

+0

방화범이 끌리지 않지만 Visual Studio에서 디버깅을했지만 jquery 내부에서 무슨 일이 벌어지고 있는지 이해할 수는 없지만 실제로 iframe thats that 's를 이해했다는 것을 이해했습니다.). jquery의 오류 처리기를 사용하려고했습니다. 그러나 그 방법은 결코 실행되지 않았다. 내가 문제를 발견한다면, 나는 당신의 관심에 다시 한번 감사 드린다. – mehmet6parmak

관련 문제