DNN MVC模块不张贴文件返回

Question

我正在构建一个小的DNN MVC模块，我需要用户上传将被处理服务器端的文件。

当表单被回发时，视图模型会很好地回传，但文件从不是。 Request.Files总是0.

我甚至简化了它，所以我在模块上所有的都是一个简单的文件输入和提交按钮，但也失败了。

我恨不得不恢复到.ascx控件才能使它工作。

我正在测试这是一个未注册的用户，因此在控制器中没有验证检查。

见下面的代码：

查看

@inherits DotNetNuke.Web.Mvc.Framework.DnnWebViewPage<NM.Modules.FlexEventsCreate.Models.FlexEventViewModel> 
@using DotNetNuke.Web.Mvc.Helpers 

<input type="file" id="fileUp"/> 
<input type="submit" id="btnSubmit" /> 

控制器

[DnnHandleError] 
public class ItemController : DnnController 
{ 
    [HttpPost] 
    public ActionResult ShowForm(FlexEventViewModel flexEvent) 
    { 
     if (ModelState.IsValid) 
     { 
      var file = Request.Files; 

      if (file.Count != 0) 
      { 
       //do something 
      } 

      //return RedirectToDefaultRoute(); 
     } 

     return View(flexEvent); 
    } 
} 

渲染HTML DNN看起来像这样（我已经简化它）

<form method="post" action="/Test" id="Form" enctype="multipart/form-data"> 

    <!-- Begin Content areas --> 
    <div> 
     <div class="row"> 
      <div class="medium-9 columns"> 
       <div id="dnn_LeftPane"> 
        <div class="DnnModule DnnModule-DnnModule-747"> 
         <a name="747"></a> 

         <div class="DnnF_Title_h1 SpacingBottom"> 
          <h1><span id="dnn_ctr747_dnnTITLE_titleLabel" class="TitleH1"></span> 

    </h1> 
          <div id="dnn_ctr747_ContentPane"> 
           <!-- Start_Module_747 --> 
           <div id="dnn_ctr747_ModuleContent"> 
            <div id="dnn_ctr747_ShowForm_Prog" class="RadAjax RadAjax_Default" style="display:none;"> 
             <div class="raDiv"> 

             </div> 
             <div class="raColor raTransp"> 

             </div> 
            </div> 
            <div class="RadAjaxPanel" id="dnn_ctr747_dnn_ctr747_ShowForm_UPPanel"> 
             <div id="dnn_ctr747_ShowForm_UP"> 
              <!-- 2013.2.717.40 --> 
              <div id="mvcContainer-747"> 

               <input type="file" id="fileUp"> 
               <input type="submit" id="btnSubmit"> 
              </div> 
             </div> 
            </div> 
           </div> 
          </div> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 

</form> 

Answer 1

我确实使用dropzone jquery component在MVC模块中进行了上传 - 这可能对您有所帮助。在github上查看我的示例Restaurant Menu project。

首先，包括悬浮窗脚本和CSS：

@using DotNetNuke.Web.Client.ClientResourceManagement 
@{ 
    ClientResourceManager.RegisterStyleSheet(Dnn.DnnPage, "~/DesktopModules/MVC/DotNetNuclear/RestaurantMenu/Resources/dropzone/css/dropzone.css"); 
    ClientResourceManager.RegisterScript(Dnn.DnnPage, "~/DesktopModules/MVC/DotNetNuclear/RestaurantMenu/Resources/dropzone/js/dropzone.min.js", 100); 
} 

然后把该上传组件的容器DIV：

<div id="dZUpload" class="uploadform dropzone no-margin dz-clickable"> 
     <div class="dz-default dz-message"></div> 
</div> 

初始化组件，并告诉它什么类型和多少文件能被上传：

$("#dZUpload").dropzone({ 
    acceptedFiles: "image/jpeg,image/png,image/gif", 
    url: '@Url.Action("Upload", "Menu")', 
    maxFiles: 1, // Number of files at a time 
    maxFilesize: 1, //in MB 
    addRemoveLinks: true, 
    maxfilesexceeded: function (file) { 
     alert('You have uploaded more than 1 Image. Only the first file will be uploaded!'); 
    }, 
    success: function (response) { 

    } 
}); 

将receivedFiles更改为您要resmtrime的mimetypes icting（“application/pdf”等）。更改maxFiles以限制他们一次可以上传的文件数量。

编写一个MVC控制器操作来响应Dropzone文件上传url。你可以看到它期望在控制器“菜单”（MenuController.Upload）上的操作方法“上载”：

public JsonResult Upload() 
{ 
    string imageUrl = string.Empty; 
    string imgPath = Server.MapPath("~/Portals/0/Restaurant/"); 
    if (!Directory.Exists(imgPath)) 
    { 
     Directory.CreateDirectory(imgPath); 
    } 

    foreach (string s in Request.Files) 
    { 
     var file = Request.Files[s]; 
     if (file.ContentLength > 0) 
     { 
      string fileName = Path.GetFileName(file.FileName); 
      var path = Path.Combine(imgPath, fileName); 
      file.SaveAs(path); 
      imageUrl = string.Format("/Portals/0/Restaurant/{0}", fileName); 
     } 
    } 

    return Json(new { img = imageUrl, thumb = imageUrl }); 
}