我正在使用BeginCollectionItem将项目动态添加到列表中。如果我尝试单击新添加的行,应用程序会立即停止并将我重定向到登录页面。如果我删除一个已经存在的项目,它会从数据库中删除它,然后从 UI 中删除它,然后将我重定向到登录页面。如果该项目是新添加的,它甚至不会运行 delete.onClick 中的代码,但它们最终都会将我重定向到登录屏幕。
我在尝试追加 div 时遇到了类似的问题,并被告知要添加:
e.preventDefault();
e.stopImmediatePropagation();
我试过了,但它并没有阻止我的应用程序停止并重定向到登录页面。这是我的删除代码:
$("a.deleteRow").on("click", function (e) {
var container = $(this).closest('.editorRow');
var id = container.data('id');
var $t = $(this);
$.ajax({
type: "POST",
url: "@Url.Action("Delete","Request", new { area = "" })",
data: { CommentId: id },
success: function (e) {
$t.parents("div.editorRow:first").remove();
e.preventDefault();
e.stopImmediatePropagation();
}
})
return false;
});
这是部分视图:
@using (Html.BeginCollectionItem("Comments"))
{
<div class="row editorRow" data-id="@Model.Id" style="padding-bottom:10px">
@Html.HiddenFor(x => x.Id)
<div class="col-xl-2">
@if (Model.CreatorName == "" || Model.CreatorName == null)
{
Html.DisplayFor(x => x.CreatorName, (string)@ViewBag.UserName);
}
else
{
@Html.DisplayFor(x => x.CreatorName)
}
</div>
<div class="col-xl-8">
@Html.TextAreaFor(x => x.Comment, new { @class = "form-control" })
</div>
<div class="col-xl-2">
<a href="#" class="deleteRow">delete</a>
</div>
</div>
}
这是控制器中的删除代码:
public ActionResult Delete(int CommentId)
{
service.DeleteComment(CommentId);
return Content("" + CommentId);
}
更新:
将删除代码放入 document.ready 后,删除现有行的 ajax 部分现在可以正常工作。但是,在不先保存该行的情况下尝试添加和删除该行仍然是重定向。现在适用于“现有”行的新删除代码如下:
$(document).ready(function () {
$("a.deleteRow").on("click", function (e) {
var container = $(this).closest('.editorRow');
var id = container.data('id');
var $t = $(this);
$.ajax({
type: "POST",
url: "@Url.Action("Delete","Request", new { area = "" })",
data: { CommentId: id },
success: function (e) {
$t.parents("div.editorRow:first").remove();
return false;
}
})
return false;
});
});
我是 jQuery 新手,我正在尝试理解并让我的项目正常工作。