asp.net-mvc 如何在MVC3 Razor的Webgrid上实现编辑和删除？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12066915/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to achieve edit and delete on Webgrid of MVC3 Razor?
提问by Sham
Below I have given the controller, model and view. After run, grid is displaying with values, but I need to edit the values and delete the values on same page. I have searched and seen some example, in that for edit, delete they creating separate index but mine need is to edit and delete should done on same page instead of another page. Please give me a solution.
下面我给出了控制器、模型和视图。运行后，网格显示值，但我需要编辑值并删除同一页面上的值。我已经搜索并看到了一些示例，其中对于编辑，删除它们创建单独的索引，但我需要的是编辑和删除应该在同一页面而不是另一个页面上完成。请给我一个解决方案。
Controller:
控制器：
public ActionResult Index()
{
var PersonList = new List<Person>()
{
new Person(){Name="A", Age=20,Id =1},
new Person(){Name="B",Age=45,Id =2},
new Person(){Name="C", Age=30,Id =3},
new Person(){Name="D",Age=55,Id =4},
new Person(){Name="E", Age=30,Id =5},
new Person(){Name="F",Age=25,Id =6},
new Person(){Name="G", Age=30,Id =7},
new Person(){Name="H",Age=25,Id =8},
};
return View(PersonList);
}
Class :
班级 ：
public class Person
{
public string Name { get; set; }
public int Age { get; set; }
}
View :
看法 ：
@model IEnumerable<edit.Models.Person>
@{
ViewBag.Title = "Index";
}
<html>
<head>
<title>Index</title>
<style type="text/css">
.webGrid { margin: 4px; border-collapse: collapse; width: 300px; }
.header { background-color: #E8E8E8; font-weight: bold; color: #FFF; }
.webGrid th, .webGrid td { border: 1px solid #C0C0C0; padding: 5px; }
.alt { background-color: #E8E8E8; color: #000; }
.person { width: 200px; font-weight:bold;}
</style>
</head>
<body>
@{
var grid = new WebGrid(Model, canPage: true, rowsPerPage: 5);
grid.Pager(WebGridPagerModes.NextPrevious);
@grid.GetHtml(tableStyle: "webGrid",
headerStyle: "header",
alternatingRowStyle: "alt",
columns: grid.Columns(
grid.Column("Name", "Given Name", canSort: true, format:@<b>@item.Name</b>, style: "person"),
grid.Column("Age", "How Old?", canSort: true)
));
}
</body>
</html>
回答by Dror
@Yasser, it is very dangerous to implement a DELETE via a GET link. A search engine crawling the page might delete all your information.
@Yasser，通过 GET 链接实现 DELETE 非常危险。抓取页面的搜索引擎可能会删除您的所有信息。
It is much better to implement a POST operation. Here is an example:
实现 POST 操作要好得多。下面是一个例子：
In the View:
在视图中：
@functions{
string Delete(dynamic p)
{
string actionController = Url.Action("Delete", "Admin", new {id=p.AccountId});
return "<form style='display:inline;' method='post' action='" + actionController + "'><input type='submit' value='Delete' onclick=\"return confirm('Are you sure?')\"/></form>";
}
}
...
grid.Column(header: "", format: p => Html.Raw(Delete(p)))
In the Controller:
在控制器中：
[HttpPost]
public ActionResult Delete(int id)
{
PerformDelete(id);
return RedirectToAction("Index");
}
回答by Yasser Shaikh
Here is something you can start with,
你可以从这里开始，
You will have to first generate two action link called "Edit" and "Delete" along with each record in the webgrid.
您必须首先生成两个名为“编辑”和“删除”的操作链接以及 webgrid 中的每条记录。
See this tutorialfor that.
请参阅本教程。
something like this
像这样的东西
grid.Column(format: (item) => Html.ActionLink("Edit", "ActionName", new { param1 = "send id here", param2 = "xtra param" }))
grid.Column(format: (item) => Html.ActionLink("Delete", "ActionName2", new { param1 = "hello", param2 = "bye" }))
Hope this helps.
希望这可以帮助。
回答by Learner
Here you go...
干得好...
I think you are looking for this.
我想你正在寻找这个。
回答by Anh Bui
You can try this inline editable gridview using asp.net mvc and knockoutjs: www.anhbui.net/blog?id=kojs-1
您可以使用asp.net mvc 和knockoutjs 尝试使用这个内联可编辑gridview： www.anhbui.net/blog?id=kojs-1
