如何使用ActionLink as submit按钮删除表格中的每一行？
如何使用ActionLink as submit按钮删除表格中的每一行？
提问于 2018-07-25 03:50:34
我正在开发一个应用程序，我需要显示的详细信息，如ID，姓名和地址的客户。一个应该能够编辑或删除每个客户的详细信息。为此，我添加了编辑和删除操作链接作为到达行的按钮。在我的控制器中，我添加了用于执行编辑或删除操作的切换案例。
我的问题是如何使用动作链接作为提交按钮。或者有没有更好的方法来编辑和删除记录？
查看：
<table class="table">
<tr>
<th>
@Html.DisplayNameFor(model => model.id)
</th>
<th>
@Html.DisplayNameFor(model => model.name)
</th>
<th>
@Html.DisplayNameFor(model => model.address)
</th>
<th></th>
</tr>
@foreach (var item in Model)
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.id)
</td>
<td>
@Html.DisplayFor(modelItem => item.name)
</td>
<td>
@Html.DisplayFor(modelItem => item.address)
</td>
<td>
@Html.ActionLink("Edit", "", new { id = item.id }) |
@Html.ActionLink("Delete", "", new { id = item.id })
</td>
</tr>
}
</table>
控制器：
HttpPost
public ActionResult MyTableView(int id, List<MyList> list)
{
switch (submitButton)
{
case "Delete":
break;
case "Edit" :
break;
}
return View ("MyTableView");
}回答 2
Stack Overflow用户
回答已采纳
发布于 2018-07-25 04:17:21
这是我经常使用的方法，因为您问到是否有不同的/更好的方法。仅供参考，此示例使用FontAwesome图标和Bootstrap4样式作为按钮。
我喜欢使用Ajax，然后根据响应以这样或那样的方式更新前端。
然后，如果用户想要编辑记录，我会将他们带到不同的页面来编辑特定条目，在那里我只使用标准视图模型和剃刀表单/ @Html.EditorFor()内容
您将注意到，HTML有一个@Item.Id，它来自@foreach(var item in list)中视图模型列表数据的迭代，这就是javascript中的ID值的来源。
控制器
public JsonResult Delete(int? id)
{
if (id == null)
{
return Json(-1);
}
var document = CommonService.GetDocument(id);
if (document == null)
{
return Json(-1);
}
if (0 == AdminService.DeleteDocument((int)id))
{
return Json(1);
}
return Json(-1);
}Html
表中有一行，如下所示
<td class="text-nowrap"><a class="btn btn-primary text-white" href="@Url.Action("Edit", "Controller", new { id = item.Id })"><i class="fa fa-pencil-square-o"></i> Edit</a> <button value="@item.Id" class="btn btn-primary text-white delete"><i class="fa fa-trash-o"></i> Delete</button></td>Javascript
$(".delete").unbind().click(function () {
var entryId = $(this).val();
if (confirm("Are you sure you want to delete?"))
{
var selected = $(this).parents("tr").addClass("selected");
$.ajax(
{
url: '@Url.Action("Delete", "Controller")',
type: "POST",
dataType: "json",
data: { id: entryId }
})
.done(function (data) {
if (data == 1) {
table.row(".selected").remove().draw(false); // Delete row from view
}
else {
Alert("Something went wrong...")
}
});
}
});Stack Overflow用户
发布于 2018-07-26 02:37:00
正如@CodingYoshi建议我这样做。
查看：
<td>
@Html.ActionLink("Edit", "EditDetails", new { id = item.id }) |
@Html.ActionLink("Delete", "Delete", new { id = item.id })
</td>
当用户点击任何链接转到该动作控制器时
public ActionResult Delete(int id){
//要删除的代码
}
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51506509
复制相关文章
相似问题