我目前正在开发一个具有 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 的局部 View 上呈现结果。在这种情况下,产品的表格列表位于此部分 View 中。在(假设)编辑过程完成后,我希望编辑的字段在编辑对话框关闭后反射(reflect)出来。我的问题是,我不知道如何在不影响整个页面的情况下刷新局部 View 。
有人可以告诉我一个好的方法吗?非常感谢!
编辑:
下面是我如何将项目添加到我的网格。请注意,整个代码都在我的 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")
));
}
最佳答案
使用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/table 并且 Items
Controller 的 GetProducts
操作方法返回标记网格的。
如果您在按钮单击事件中执行保存/更新,请确保使用 peventDefault
方法停止默认表单提交行为
$("#someButtonId").click(function(e){
e.preventDefault();
//Save data or whatever ...
});
编辑: 设置更新后的问题。
为什么要将 UI(view
)与 code
混合在一起。将其分开。
有一个 action
来获取数据并将其传递给强类型 View
public ActionResult GetProducts()
{
var repository = new MyStore.Business.Manager.ProductsManager ();
var productList = repository.GetAllProducts(ViewData["StoreCode"].ToString());
return View(productList);
}
现在有一个 View (GetProducts.cshtml
),它是 Lost of Products 类的强类型。
@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>
就我个人而言,我将我的实体/模型名称保留为单数,例如 Customer
/Product
关于javascript - MVC 4 仅刷新 PartialView,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11497411/