<分区>
<分区>
我需要在用户点击删除按钮时添加一个删除确认框。我该怎么做？在运行删除代码之前，在 html 页面上还是在我的 Controller 调用中？或者 Bootstrap 可以做到吗？我迷路了。
这是我的按钮元素和我的 Controller 操作。
<div class="row">
<div class="col-md-6">
<input type="submit" value="Save" class="btn btn-lg btn-primary" />
</div>
@if (!Model.IsNew)
{
<div class="col-md-6">
<a href="@(Url.Action<UnitsController>(c => c.Delete(Model.Entity.Id)))" class="btn btn-primary col-md-offset-9 col-md-3 ">Delete</a>
</div>
}
</div>
Controller
public ActionResult Delete(int id)
{
var record = DataAccessService.Get<Unit>(id);
DataAccessService.Delete(record);
DataAccessService.Save();
return RedirectToAction<UnitsController>(u => u.Index());
}
最佳答案
您可以使用 Javascript 的 confirm，它会在消息显示在浏览器上后返回一个 bool 值，或者使用 css bootstrap，因为您的应用程序中有它。
只需在 a 标记的 onclick 事件上添加一个确认。例如:
<a href="@(Url.Action<UnitsController>(c => c.Delete(Model.Entity.Id)))"
class="btn btn-primary col-md-offset-9 col-md-3"
onclick="return confirm('Are you sure you want to delete this item?')">Delete</a>
由于您使用的是 css bootstrap，因此您可以毫无问题地尝试它。 sample 。
定义模态窗口的css标签
<div id="deleteConfirm" class="modal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Delete Entity</h4>
</div>
<div class="modal-body">
<p>Are you sure you want to delete this item?</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button id="deleteButton" type="button" class="btn btn-primary">Confirm</button>
</div>
</div>
</div>
</div>
为 deleteButton 定义事件点击以发出 ajax 请求并删除它。
$("#deleteButton").on("click", function(e) {
$.ajax({
url: "@Url.Action("Delete", "Controller")",
method: "POST",
data: { id: @Model.Id }
})
.done(function(data) {
// hide the modal
$("#deleteConfirm").modal("hide");
if (data.success) {
// ok
} else {
// show errors
}
});
});
最后，在确认删除的按钮上显示模式。例如:
<a href="@(Url.Action<UnitsController>(c => c.Delete(Model.Entity.Id)))"
class="btn btn-primary col-md-offset-9 col-md-3"
id="deleteConfirmButton">Delete</a>
并设置事件。
$("#deleteConfirmButton").on("click", function() {
$("#deleteConfirm").modal("show");
});
关于javascript - 如何创建C#删除确认框，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37398626/