如何在表行单击后刷新局部视图

我有表，与模型相关联。

@foreach (var item in Model) {  @Html.DisplayFor(x => item.Field1)  @Html.DisplayFor(x => item.Field2)   } 

如何使用ajax更新我的局部视图，以便从表中编辑所选模型。 我删除了onclick="window.location.href = '@Url.Action("Action", new RouteValueDictionary { { "id", item.Id } })'"并添加了脚本：

 $(function () { $('tr').click(function () { $.ajax({ url: '@Url.Action("Action", new RouteValueDictionary { { "id", ??? } })', type: 'GET', cache: false, success: function (result) { $('#partialView_div').html(result); } }); return false; }); }); 

但是，我现在不知道如何将Model.Id传递给这个脚本。

Answer 1

您可以使用属性来保存item.Id并在事件处理程序中获取它。 此外，您不需要使用window.location.href

CSHTML

 @foreach (var item in Model) {  @Html.DisplayFor(x => item.Field1)  @Html.DisplayFor(x => item.Field2)   } 

JavaScript的

 $('tr.deleteItem').click(function () { $.ajax({ url: $(this).data("url"), type: 'GET', cache: false, success: function (result) { $('#partialView_div').html(result); } }); return false; }); 

要么

CSHTML

 @foreach (var item in Model) {  @Html.DisplayFor(x => item.Field1)  @Html.DisplayFor(x => item.Field2)   } 

JavaScript的

 $('tr.deleteItem').click(function () { var url = '@Url.Action("Action", "Controller", { "id" = "???" })'; url = url.replace("???", $(this).data("item-id")); $.ajax({ url: url, type: 'GET', cache: false, success: function (result) { $('#partialView_div').html(result); } }); return false; }); 

Answer 2

我会尽力使这个变得简单

  @foreach (var item in Model) {  @Html.DisplayFor(x => item.Field1)  @Html.DisplayFor(x => item.Field2)   } 

jQuery的

 $(function () { $('tr').click(function () { $.ajax({ url: 'controller/action/', type: 'GET', cache: false, data:{id:$(thi).data("item-id")}, success: function (result) { $('#partialView_div').html(result); } }); return false; }); }); 

Answer 3

请按照以下步骤操作，以获得所需的输出。 主视图

 @model IEnumerable @{ ViewBag.Title = "Index"; } 
Index
     @foreach (var item in Model) {  } 
 
 
 @item.Id 
 
 @item.Field1 
 
 @item.Field2 
 
  

调节器

  [HttpGet] public ActionResult Index() { List obj = new List { new Test{Id=1,Field1="Field11",Field2="Field21"}, new Test{Id=2,Field1="Field12",Field2="Field22"}, new Test{Id=3,Field1="Field13",Field2="Field23"}, }; return View(obj); } public ActionResult Test1(int itemid) { PartialViewModel obj = new PartialViewModel(); obj.Id = itemid; return PartialView("~/Views/Partial1.cshtml", obj); } 

模型

 public class Test { public int Id; public string Field1; public string Field2; } public class PartialViewModel { public int Id; } 

部分视图

 @model MvcApplication2.Models.PartialViewModel @Model.Id