如何使用 asp.net mvc 从表视图中删除选定的记录
How to delete selected record from tableview using asp.net mvc
这是成功运行的我的视图代码编辑按钮。我想删除特定的选定记录。当您单击删除图标模型弹出窗口将打开时,它会询问是或否。如果用户单击是,我需要调用操作方法。如何调用该方法?当我尝试将 运行 参数设置为 null 时,它开始执行方法。
<table id="mytable" class="table table-bordred table-striped">
<thead>
<tr>
<th>User ID</th>
<th>User Name</th>
<th>Email</th>
<th>Edit</th>
<th>Delete</th>
</tr>
</thead>
<tbody>
@foreach (var gt in Model.UserList)
{
<tr>
<td>@gt.UserId</td>
<td>@gt.UserName</td>
<td>@gt.Email</td>
@using (Ajax.BeginForm("getUserDetailById", new AjaxOptions() { UpdateTargetId = "Edit-User", AllowCache = true, InsertionMode = InsertionMode.ReplaceWith,LoadingElementId="resultLoadingDiv" }))
{
@Html.Hidden("userId", @gt.UserId)
<td><p data-placement="top" data-toggle="tooltip" title="Edit/View"><button class="btn btn-primary btn-xs" data-title="Edit/View" data-toggle="modal" data-target="#edit"><span class="glyphicon glyphicon-pencil"></span></button></p></td>
}
<td><button class="btn btn-danger btn-xs delete" data-userid="@gt.UserId" data-title="Delete"><span class="glyphicon glyphicon-trash"></span></button></td>
</tr>
}
</tbody>
</table>
脚本:
debugger;
$('#mytable').on('click', '.delete', function () {
var userId = $(this).data('UserId');
if (bootbox.confirm('Do you want to delete this item?', function (result)
{
if (result == true) {
$.ajax({
type: "POST",
url: "Admin/deleteUser/" + userId,
success: function (result) {
},
complete: function () {
},
error: function (xhr, status, errorThrown) {
}
});
}
else {
return;
}
}));
})
我的控制器:
[HttpPost]
public JsonResult deleteUser(string userId)
{
_objuser = new UserService();
var status = true;
var gt = _objuser.deleteUserDetail(userId);
return new JsonResult { Data = status, JsonRequestBehavior =
JsonRequestBehavior.AllowGet };
}
可能只是控制器动作的问题。
最好下载并使用 Bootbox 以获得应用程序中一致的警告框,而且它也易于使用:
bootbox.confirm({
message: "This is a confirm with custom button text and color! Do you like it?",
buttons: {
confirm: {
label: 'Yes',
className: 'btn-success'
},
cancel: {
label: 'No',
className: 'btn-danger'
}
},
callback: function (result) {
if(result === true){
//YOUR DELETE ACTION METHOD AJAX CALL HERE
}
}
});
将这样的删除事件附加到您的 table 删除按钮
$('#yourTableId').on('click', '.delete', function () {
var userId= $(this).data('userid');
if (bootbox.confirm('Do you want to delete this item?', function (result) {
if (result == true) {
$.ajax({
type: "POST",
url: "Admin/deleteUser",
data:JSON.stringify({userId:userId})
contentType: 'application/json; charset=utf-8',
success: function (result) {
},
complete: function () {
},
error: function (xhr, status, errorThrown) {
}
});
}
else {
return;
}
}));
更改视图中的删除按钮如下:
<button class="btn btn-danger btn-xs delete" data-userid="@gt.UserId" data-title="Delete"><span class="glyphicon glyphicon-trash"></span></button>
这是成功运行的我的视图代码编辑按钮。我想删除特定的选定记录。当您单击删除图标模型弹出窗口将打开时,它会询问是或否。如果用户单击是,我需要调用操作方法。如何调用该方法?当我尝试将 运行 参数设置为 null 时,它开始执行方法。
<table id="mytable" class="table table-bordred table-striped">
<thead>
<tr>
<th>User ID</th>
<th>User Name</th>
<th>Email</th>
<th>Edit</th>
<th>Delete</th>
</tr>
</thead>
<tbody>
@foreach (var gt in Model.UserList)
{
<tr>
<td>@gt.UserId</td>
<td>@gt.UserName</td>
<td>@gt.Email</td>
@using (Ajax.BeginForm("getUserDetailById", new AjaxOptions() { UpdateTargetId = "Edit-User", AllowCache = true, InsertionMode = InsertionMode.ReplaceWith,LoadingElementId="resultLoadingDiv" }))
{
@Html.Hidden("userId", @gt.UserId)
<td><p data-placement="top" data-toggle="tooltip" title="Edit/View"><button class="btn btn-primary btn-xs" data-title="Edit/View" data-toggle="modal" data-target="#edit"><span class="glyphicon glyphicon-pencil"></span></button></p></td>
}
<td><button class="btn btn-danger btn-xs delete" data-userid="@gt.UserId" data-title="Delete"><span class="glyphicon glyphicon-trash"></span></button></td>
</tr>
}
</tbody>
</table>
脚本:
debugger;
$('#mytable').on('click', '.delete', function () {
var userId = $(this).data('UserId');
if (bootbox.confirm('Do you want to delete this item?', function (result)
{
if (result == true) {
$.ajax({
type: "POST",
url: "Admin/deleteUser/" + userId,
success: function (result) {
},
complete: function () {
},
error: function (xhr, status, errorThrown) {
}
});
}
else {
return;
}
}));
})
我的控制器:
[HttpPost]
public JsonResult deleteUser(string userId)
{
_objuser = new UserService();
var status = true;
var gt = _objuser.deleteUserDetail(userId);
return new JsonResult { Data = status, JsonRequestBehavior =
JsonRequestBehavior.AllowGet };
}
可能只是控制器动作的问题。
最好下载并使用 Bootbox 以获得应用程序中一致的警告框,而且它也易于使用:
bootbox.confirm({
message: "This is a confirm with custom button text and color! Do you like it?",
buttons: {
confirm: {
label: 'Yes',
className: 'btn-success'
},
cancel: {
label: 'No',
className: 'btn-danger'
}
},
callback: function (result) {
if(result === true){
//YOUR DELETE ACTION METHOD AJAX CALL HERE
}
}
});
将这样的删除事件附加到您的 table 删除按钮
$('#yourTableId').on('click', '.delete', function () {
var userId= $(this).data('userid');
if (bootbox.confirm('Do you want to delete this item?', function (result) {
if (result == true) {
$.ajax({
type: "POST",
url: "Admin/deleteUser",
data:JSON.stringify({userId:userId})
contentType: 'application/json; charset=utf-8',
success: function (result) {
},
complete: function () {
},
error: function (xhr, status, errorThrown) {
}
});
}
else {
return;
}
}));
更改视图中的删除按钮如下:
<button class="btn btn-danger btn-xs delete" data-userid="@gt.UserId" data-title="Delete"><span class="glyphicon glyphicon-trash"></span></button>