使用partialview时,HttpPostedFileBase始终为null

Question

我正在开发一个使用自定义模式弹出窗口在服务器上上传pdf文件的应用程序.我正在使用文件上传浏览器html控件来上传.pdf文件,此控件是在部分视图中设计的.当我点击"添加"按钮然后在服务器端我没有得到HttpPostedFileBase和FormCollection值.

这是我的代码:

局部视图:

@model Zytron.Models.ProductDataControls

    @using (Html.BeginForm("UploadFiles", "AdminPanel", FormMethod.Post, new
    {
        @id = "file_upload",
    }))

    {

        <table width="100%" cellpadding="5" cellspacing="1">
            <tr>
                <td>
                    <span>Description</span>
                </td>
            </tr>
            <tr>
                <td>
                    @Html.TextBoxFor(m => m.Description, new
               {
                   @class = "textBox"
               })
                    @Html.HiddenFor(m => m.ProductId)
                    @Html.HiddenFor(m => m.ParentId)
                </td>
            </tr>
            <tr>
                <td>
                    <span>File Source</span>
                </td>
            </tr>
            <tr>
                <td>
                    <input type="file" id="fileUpload" name="fileUpload" size="23" />
                </td>
            </tr>
        </table>
    }

型号代码:

public class ProductDataControls

 {



       public string Description { get; set; }

  }

自定义模态弹出代码:

function loadProdAttachFile(tag, event, target) 
{
    event.preventDefault();
    var $loading = $('<img src="@Url.Content("~/Images/ajaxLoading.gif")" alt="loading" class="ui-loading-icon">');
    var $url = $(tag).attr('href');
    var $title = $(tag).attr('title');
    var $dialog = $('<div></div>');
    $dialog.empty();
    //            alert($url);
    $dialog
            .append($loading)
            .load($url)
              .dialog({
                  autoOpen: false
               , title: $title
               , width: 500
               , modal: true
               , minHeight: 220
               , show: 'fade'
               , hide: 'fade'
              });

              $dialog.dialog("option", "buttons", {
                  "Add": function () {
                      var dlg = $(this);
                      //$('form#file_upload').submit();

                      var file = document.getElementById("fileUpload").value;
                      var pid = getParamValue("pid", $url);
                      var type = getParamValue("type", $url);

                      $.ajax({
                          url: '/AdminPanel/UploadFiles',
                          type: 'POST',
                          data: { 'file': file, 'pid' : pid, 'type' : type },
                          success: function (response) {
                              dlg.dialog('close');
                              dlg.empty();
                          },
                          error: function (xhr) {
                              if (xhr.status == 400)
                                  dlg.html(xhr.responseText, xhr.status);     /* display validation errors in edit dialog */
                              else
                                  displayError(xhr.responseText, xhr.status); /* display other errors in separate dialog */
                          }
                      });

                  },
                  "Cancel": function () {
                      $(this).dialog("close");
                      $(this).empty();
                  }
              });
    $dialog.dialog('open');
};

控制器代码:

[HttpPost]

public void UploadFiles(HttpPostedFileBase file, FormCollection form)
{
}

查看代码:

<a href "/ UploadFiles” class="ModalDlgProdAttachment"   <img src=”../Images/MyImage.jpg" /> </a>

$('a. ModalDlgProdAttachment).live("click", function (event) { loadProdAttachFile(this, event, "# file_upload"); });

Answer 1

您无法使用 AJAX 上传文件。这在 StackOverflow 上已经讨论过很多次了。您有几个解决方案：

• 如果您使用的客户端浏览器支持，HTML5 File API您可以使用它来使用 AJAX 上传文件。
• 如果他们不支持，您可以使用文件上传组件，例如UploadifyBlueImp File Upload和Valums File Uploader。这些控件将测试客户端浏览器是否支持 HTML5，如果支持则使用它，如果它不回退到涉及使用隐藏 iframe 或 Flash 电影的其他技术。