Question

我正在尝试添加删除/删除动态创建的局部视图。这是我的ADD脚本。

    $("#btnAdd").on('click', function () {
    $.ajax({
        async: false,
        url: '/Employees/Add'
    }).success(function (partialView) {
        $('#AddSchedule').append("<tbody>" + partialView + "</tbody>");      
    });
});

这是添加控制器

public ActionResult Add()
    {
        var schedViewModel = new FacultySchedViewModel();
        return PartialView("~/Views/Employees/_DynamicView.cshtml", schedViewModel);
    }

这是局部视图_DynamicView.cshtml

@using(Html.BeginCollectionItem("New")){
    <td>
        @Html.ActionLink("Delete", "DeleteThis", "MyController", null)
    </td>
    <td>
        @Html.EditorFor(model => @Model.Schedule, new { htmlAttributes = new { @class = "form-control" } })
    </td> }

我无法弄清楚的是

如何获取BeginItemCollection生成的ID
在删除脚本中使用ID
控制器上的操作

修改 1.如何将其连接到按钮或链接以删除行

在局部视图的主要内容中添加了视图

 @for (int i = 0; i < @Model.New.Count(); i++)
                {               
                   @Html.EditorFor(model => @Model.New[i])

                }

Answer 1

BeginItemCollection将Guid添加为控件名称和id属性的索引器。它与确定要删除的项目完全没有关系。您需要添加包含标识FacultySchedViewModel对象的属性的值。假设其int ID，则更改部分以包含按钮，并将ID添加为data-属性

@using(Html.BeginCollectionItem("New"))
{
  <tr>
    <td><button type="button" class="delete" data-id="@Model.ID">Delete</button></td>
    <td>@Html.EditorFor(model => @Model.Schedule, new { htmlAttributes = new { @class = "form-control" } })</td>
  </tr>
}

然后你的脚本将是

var url = '@Url.Action("Delete")'; // assumes its in the same controller
$('.delete').click(function() {
  var id = $(this).data('id');
  var row = $(this).closest('tr');
  if (id) { // or if(id == 0) depending if your property is nullable
    row.remove(); // the item never existed so no need to call the server
    return;
  }
  $.post(url, { ID: id }, function(response) {
    if(response) {
      row.remove(); // OK, so remove the row
    } else {
      // Oops - display and error message?
    }
  });
});

和控制器

[HttpPost]
public JsonResult Delete(int ID)
{
  // Delete the item in the database
  return Json(true); // or if there is an error, return Json(null); to indicate failure
}

旁注：

$('#AddSchedule').append("<tbody>" + partialView + "</tbody>");是为每个项目添加新的tbody元素。而是主要观点应该包含tbody元素并将其id赋予它 $('#AddSchedule').append(partialView);或使用$('#AddSchedule tbody')append(partialView);
您回帖的模型是否真的有一个名为New的属性（正如您在BeginItemCollection方法中指出的那样）？

Answer 2

根据您的html渲染，我建议将部分视图修改为

From 
  @Html.ActionLink("Delete", "DeleteThis", "MyController", null)
To
  @Html.ActionLink("Delete", "DeleteThis", "MyController", new { hidefocus = "hidefocus" } )  //add custom properties for here, which you can grab at client side or give css here.

现在通过jQuery: Find the element with a particular custom attribute搜索锚链接当你获得身份证时，你可以像$('#id').parent().parent().hide() or empty()

那样去做父母

或

作为第二个选项，点击Delete button调用相同的控制器，但是用一个参数来识别删除，所以在返回时给出null将再次用空字符串在ajax中绑定。

Why does Html.ActionLink render "?Length=4"

http://forums.asp.net/t/1787278.aspx?Add+and+remove+partial+views

删除/删除动态创建的局部视图mvc

2 个答案: