양식 태그가없는 MVC 파일 업로드

Question

내보기 - UploadDocument를 표시 할 색상 상자 팝업이 있습니다. 이 뷰에서 파일 업로드 요소 (type = "file") 및 텍스트 상자가 있습니다. 내보기에

<h4 class="resume">Upload a document to presentation </h4> 
    <div class="description">Please click on the link below to add documents to your presentation.</div> 

    <table id="fieldsTable" class="tblFields"> 
    <tr> 
    <td class="description">Choose file:</td> 
     <td> <input id="fileDialog" type="file" name="file"/></td> 
    </tr> 
    <tr> 
    <td class="description">Description:</td> 
     <td> <input type="text" id="docFileName" style="width: 225px;"/></td> 
    </tr> 
    <tr> 
    <td colspan="2" width="300px"><span class="errorMessage" id="spanErrorMessage"></span></td> 
    </tr> 
    </table> 

내가 저장 버튼의 클릭에 컨트롤러 액션의 포스트 메소드를 호출하고 - 여기

는

parent.parent.$.fn.colorbox({ 
          href: url + '?callingWindow=' + window.frameElement.id, 
          open: true, 
          iframe: true, 
          width: "450px", 
          height: "300px", 
          title: "Upload Document", 
          close: '<button id=\"Save\">Save</button><button id=\"Cancel\">Cancel</button>', 
          onClosed: false 
         }); 

UploadDocument보기는 colorbox-

코드입니다.

이제 HttpPostedFileBase를 사용하여 작업 메서드 UploadDocument를 매개 변수로 호출합니다. 항상 null입니다.

이것이 작동하려면 태그가 있어야하고 입력 = 제출해야합니까? 저장 단추가보기의 일부가 아니기 때문에 여기서는 할 수 없지만 부모는 기본 단추를 클릭하고 양식 태그없이이 작업을 수행 할 수있는 대안이 있습니까?

Answer 1

아약스 전화를 통한 파일 업로드는 믿기지 않는 것처럼 작동하지 않습니다. 몇 개의 텍스트 상자가있는 표준 양식 게시물처럼 양식 값을 게시 할 수 없습니다.

그러나 당신을 도울 수 밖에 플러그인의 몇 가지가있다, 또는 당신의 필요 조건에 따라 당신이 FormData 활용할 수 있습니다 - 여기 formdata와 코드입니다 :

parent.$('#Save').click(function() { 
    var data = new FormData(); 
    fd.append("id", cmaId); 
    fd.append("fileDialog", $("#fileDialog")[0]); 

    $.ajax({ 
     url: '@Url.Action("UploadDocument", "MyController")', 
     type: 'POST', 
     dataType: 'json', 
     data: data, 
     contentType: false, 
     processData: false, 
     success: function() { 
      alert('added to temp'); 
     } 
    }); 
}); 

내가 이것을 실행하지 않았다, 그것은 거칠지 만 시작하기에 충분할 것입니다. FormData와 함께 jQuery를 사용하려는 경우 contentType + processData 옵션을 false로 설정해야 jQuery가 게시물 데이터/헤더를 변경하지 않는다는 것을 알고 있어야합니다.