Question

我目前正在开发一个具有CRUD功能的网站。我在使用以下javascript代码在成功完成添加，编辑或删除后显示消息。

function addSuccess(data) {
    if (data.Success == true) {
        $('#addDialog').dialog('close');
        $('#commonMessage').html("Process Complete");
        $('#commonMessage').delay(400).slideDown(400).delay(3000).slideUp(400);
    }
    else {
        $("#add-message").html(data.ErrorMessage);
        $("#add-message").show();
    }
}

但是，我在包含webGrid的局部视图上渲染结果。在这种情况下，产品的表格列表位于此部分视图中。在（比方说）编辑过程完成后，我想在编辑对话框关闭后反映已编辑的字段。我的问题是，我不知道如何在不影响整个页面的情况下刷新部分视图。

有人可以指点我这么做的好方法吗？非常感谢你！

修改

以下是我向网格添加项目的方法。请注意，整个代码都在我的PartialView中。谢谢！

@{
    MyStore.Business.Manager.ProductsManager repository = new MyStore.Business.Manager.ProductsManager ();

    List<MyStore.Data.Products> ProductsList = repository.GetAllProducts(ViewData["StoreCode"].ToString());

    var grid = new WebGrid(ProductsList );

    grid.Pager(WebGridPagerModes.All);
            @grid.GetHtml(tableStyle: "webGrid",
                htmlAttributes: new { id = "DataTable" },
                headerStyle: "header",
                alternatingRowStyle: "alt",
                columns: grid.Columns(
                    grid.Column("ProductCode", style: "width: 400px;"),
                    grid.Column("Name", style: "width: 400px"),
                    grid.Column("Price", style: "width: 100px;"),
                    grid.Column("", format: @<text>@Html.ActionLink("Edit", "_Edit", new { RecordID = item.RecordID }, new { @class = "editLink" })</text>, style: "width: 100px"),
                    grid.Column("", format: @<text>@Html.ActionLink("Delete", "_Delete", new { RecordID = item.RecordID }, new { @class = "editLink" })</text>, style: "width: 100px")
                                                 ));                                                      
    }

Answer 1

使用jquery ajax重新加载内容

if (data.Success == true) {
    $('#addDialog').dialog('close');
    $('#commonMessage').html("Process Complete")
                   .delay(400).slideDown(400).delay(3000).slideUp(400);

    $("#yourContainerDiv").load("Url.Action("GetProducts ","Items")")

}

假设yourContainerDiv是您拥有网格标记的Div /表格，GetProducts Items控制器的peventDefault操作方法会返回网格的标记。

如果您在按钮单击事件中执行保存/更新，请确保使用$("#someButtonId").click(function(e){ e.preventDefault(); //Save data or whatever ... });方法停止默认表单提交行为

view

编辑： 在设置更新的问题后。

为什么要将您的用户界面（code）与action混合在一起。保持独立。

让public ActionResult GetProducts() { var repository = new MyStore.Business.Manager.ProductsManager (); var productList = repository.GetAllProducts(ViewData["StoreCode"].ToString()); return View(productList); }获取数据并将其传递给强类型视图

GetProducts.cshtml

现在有一个视图（@model MyStore.Data.Products @{ Layout=null; } <table> @foreach(var item in Model) { <tr> <td>@item.ProductCode</td> <td>@item.Name</td> <td>@item.Price</td> </tr> } </table>），它是Lost of Products类的强类型。

Customer

就个人而言，我将我的实体/模型名称保持为单一状态Product / {{1}}

MVC 4仅刷新部分视图

1 个答案: