编辑后更新部分视图

Question

我有以下索引：

<div id='addProduct'>
   @{ Html.RenderPartial("Create", new BoringStore.Models.Product()); }
</div>

<div id='productList'>
    @{ Html.RenderPartial("ProductListControl", Model.Products); }
</div>

部分 Create 视图包含一个不可见的 div，用于创建新产品。 这样做后，部分视图 ProductListControl 会更新。

现在我想使用编辑功能来做到这一点。 问题：无法在加载索引时集成编辑页面，因为此时我不知道用户要编辑哪个产品。

我的想法： 我想在 jquery 模式中调用我现有的编辑视图（不是问题），以便用户可以执行更改。 保存模式后关闭（仍然不是问题 - 我可以处理这个）并且 ProductListControl 被更新（这是我的问题...... :()。

我怎么能这样做？ 我看过一些教程，但我想让它尽可能干净和简单。 他们中的大多数都在使用 dom 操作并通过 JsonResult 从服务器（控制器）获取反馈。 如果可能的话，我想坚持使用 razor 语法，不使用纯 JavaScript 或 jquery，如果可能的话，我想避免使用 JsonResults。

Answer 1

一种方法可能是使用 Ajax.BeginForm 创建产品视图。

Ajax.BeginForm 接受许多 AjaxOptions，一个是 UpdateTargetId（您的 DOM id，在本例中是您的产品列表 div），更多信息 here。

然后在您的产品控制器代码中，您可以返回带有产品列表的部分视图。比如：

索引.cshtml

@using (Ajax.BeginForm("AjaxSave", "Product", new AjaxOptions { HttpMethod = "GET", UpdateTargetId = "productList", InsertionMode = InsertionMode.Replace }))
{ 
    // your form
    <p>
        <input type="submit" value="Save" />
    </p>
}

...

<div id="productList">...
</div>

ProductController.cs

[HttpGet]
public ActionResult AjaxSave(Product product)
{
    if (ModelState.IsValid)
    {
        // save products etc..
    }

    var allProducts = _productService.GetAllProducts();

    return PartialView("ProductListControl", allProducts);

}

关于这个here 有一篇很好的文章。