从控制器加载部分视图答案

【问题标题】：Load partial view from controller从控制器加载部分视图
【发布时间】：2013-11-13 03:49:46
【问题描述】：

请多多包涵，我正在学习 asp.net MVC 3.. :)

我已经搜索了大量的论坛帖子，但我真的找不到适合我的项目的好解决方案..

场景：我有一个 _layout，它可以渲染我的身体。在我目前正在努力处理的正文中，我有一个通过 ajax.actionlink 和占位符 div 更新的部分视图。

主视图（缩短）

<div class="mini-menu-content">
    Product
    <ul>
        <li>
            @Ajax.ActionLink("Aanmaken", "_addProduct", new { type = "Beheer/Add/_addProduct" },
                            new AjaxOptions
                             {
                                 UpdateTargetId = "container",
                                 InsertionMode = InsertionMode.Replace,
                                 HttpMethod = "GET"
                             })
        </li>
    </ul>
</div>
<div id="container">@Html.Partial("Beheer/_welkom")
</div>

在该部分视图中，我有一个 Html.BeginForm，其中包含所有必需（模型）产品属性的输入。它还要求用户上传文件。

局部视图（也缩短了）

@model BlokCWebwinkelGroep3.Models.Product
@using (Html.BeginForm("_addProduct", "Beheer", FormMethod.Post,
 new
 {
     enctype = "multipart/form-data",
     id = "Form",
     name = "Form"
 }))
{   
//All the input fields for the model

<div class="editor-label">
    Plaatje:
</div>
<div class="editor-field">
    <input type="file" name="imageFile" required="true" />
    <input type="submit" value="Aanmaken" />
</div>
}

这个表单链接到一个actionmethod，它保存文件（图像）并获取路径（todo），然后它将路径和产品保存到数据库中，并返回视图.. 唉有问题.我不知道如何返回该视图，因此它将替换我主视图中容器 div 的内容。我只是得到一个新页面...

控制器

public ActionResult Beheer()
{
    return View();
}

public ActionResult _addProduct(string type)
{
    return PartialView(type);
}

[HttpPost]
    public ActionResult _addProduct(HttpPostedFileBase imageFile, Product product)
    {
        if (ModelState.IsValid && (imageFile != null && imageFile.ContentLength > 0))
        {
            //Save to folder, get path, call dbcontroller and save all of it in db.
            return PartialView("Beheer/_welkom");
        }
        else
        {
            return PartialView("Beheer/Add/_addProduct", product);
        }
    }

结论性问题

如何从控制器中的操作方法 _addProduct 渲染位于主视图中的 div id="container" 中的 _addProduct 部分？

非常感谢。

【问题讨论】：

标签： forms asp.net-mvc-3 asp.net-ajax asp.net-mvc-partialview

【解决方案1】：

在您的部分视图中，您当前拥有一个标准的Html.BeginForm，它呈现一个普通的<form> 标记并对服务器进行完整的回发。这解释了为什么您没有收到 AJAX 调用。

另一方面，此表单需要将文件上传到服务器。但如您所知，您不能使用 AJAX 将文件上传到服务器。当然，除非您使用一些 javascript 文件上传插件，例如 jquery.form、blueimp file upload 或 Uploadify。顺便说一句，在支持HTML5 File API 的现代浏览器中，您可以使用 AJAX 请求将文件上传到服务器。前面提到的插件基本上简化了检测客户端浏览器功能并在必要时使用回退机制（例如旧浏览器的隐藏 iframe）的任务。

总而言之，您需要使用 javascript 才能将文件上传到服务器并保持在同一页面上。

【讨论】：