如何实现编辑和删除MVC3剃刀的WebGrid? [英] How to achieve edit and delete on Webgrid of MVC3 Razor?

查看:169
本文介绍了如何实现编辑和删除MVC3剃刀的WebGrid?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

下面我给控制器,模型和视图。运行后,电网与值显示,但我需要在同一页上编辑值,并删除该值。我已经搜索并看到了一些例子,在对编辑,删除他们创建单独的索引,但我的需要是编辑和删除应同一个页面,而不是另一个页面上完成的。请给我一个解决方案。

控制器:

 公众的ActionResult指数()
        {
            VAR PersonList =新的List<&人GT;()
            {
            新的Person(){名称=A,年龄= 20,ID = 1},
            新的Person(){名称=B,年龄= 45,ID = 2},
            新的Person(){名称=C,年龄= 30,ID = 3},
            新的Person(){名称=D,年龄= 55,ID = 4},
            新的Person(){名称=E,年龄= 30,n = 5},
            新的Person(){名称=F,年龄= 25,ID = 6},
            新的Person(){名称=G,年龄= 30,n = 7},
            新的Person(){名称=H,年龄= 25,ID = 8},
            };            返回查看(PersonList);
        }

类:

 公共类Person
    {
        公共字符串名称{;组; }
        公众诠释年龄{搞定;组; }
    }

查看:

  @model IEnumerable的< edit.Models.Person>@ {
    ViewBag.Title =指数;
}< HTML和GT;
< HEAD>
<标题>指数< /标题>
<风格类型=文/ CSS>
.webGrid {保证金:4PX;边境崩溃:崩溃;宽度:300像素; }
.header {背景颜色:#E8E8E8;字体重量:大胆的;颜色:#FFF; }
.webGrid日.webGrid TD {边界:1px的固体#C0C0C0;填充:5像素; }
.ALT {背景颜色:#E8E8E8;颜色:#000; }
.person {宽度:200像素;字体重量:大胆;}
< /风格>
< /头>
<身体GT;
@ {
VAR电网=新的WebGrid(型号,canPage:真的,rowsPerPage:5);
grid.Pager(WebGridPagerModes.Next previous);
@ grid.GetHtml(TABLESTYLE的WebGrid
headerStyle:头,
alternatingRowStyle:ALT,
列:grid.Columns(
grid.Column(姓名,赐名,canSort:真实,格式为:@< B> @ item.Name< / B>中的风格:人),
grid.Column(时代,你多大?,canSort:真)
));
}
< /身体GT;
< / HTML>


解决方案

@Yasser,这是非常危险的实现通过GET链接删除。搜索引擎抓取的页面可能会删除您的所有信息。

有很多更好地执行POST操作。下面是一个例子:

在View:

  @functions {
  串删除(动态P)
  {
    字符串的ActionController = Url.Action(删除,管理,新{ID = p.AccountId});
    回归<形式风格=显示:内联;'方法='后'行动='+的ActionController +'><输入类型=提交值=删除的onclick = \\返回确认(你确定吗?')\\/>< /表格及GT;
  }
}...
grid.Column(标题:,格式为:P => Html.Raw(删除(P)))

在控制器:

  [HttpPost]
公众的ActionResult删除(INT ID)
{
   PerformDelete(ID);
   返回RedirectToAction(「指数」);
}

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>

解决方案

@Yasser, it is very dangerous to implement a DELETE via a GET link. A search engine crawling the page might delete all your information.

It is much better to implement a POST operation. Here is an example:

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");
}

这篇关于如何实现编辑和删除MVC3剃刀的WebGrid?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆