使用GridView加DetailsView实现查询,新增,编辑,删除

转载 2008年03月11日 10:52:00

数据库:Northwind
Table :Categories

下面的操作将实现下图中的功能

  • 列表中的数据可以根据查询条件而改变
  • 列表中可进行编辑,删除,选中操作
  • 选中某条数据后,Details中显示详细信息
  • 在详细信息显示区域,可进行新增,编辑,删除操作

      这是一个非常常见的数据维护页面,在asp.net1.1中要实现以上操作,还是有一定的编码工作量,如果数据底层封装得比较好,或是使用了ORM,那么这个页面在1.1下估计是2个小时完成,而使用asp.net 2.0,10分钟搞定。

      1. 新建一个SqlDataSource

<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
   DeleteCommand
="DELETE FROM [Categories] WHERE [CategoryID] = @CategoryID" 
   InsertCommand
="INSERT INTO [Categories] ([CategoryName], [Description]) VALUES (@CategoryName, @Description)"
   SelectCommand
="SELECT [CategoryID], [CategoryName], [Description], [Picture] FROM [Categories] WHERE CategoryName LIKE '%'+@CategoryName+'%'"
   UpdateCommand
="UPDATE [Categories] SET [CategoryName] = @CategoryName, [Description] = @Description WHERE [CategoryID] = @CategoryID">
   
<SelectParameters>
   
<asp:ControlParameter ControlID="TextBoxCategoryName" Name="CategoryName" Type="String" PropertyName="Text" ConvertEmptyStringToNull="False"/>
   
</SelectParameters>
</asp:SqlDataSource>
  • 可以使用向导完成,也可以自己手动添加
  • 所有操作都由他来完成,省了很多体力活,也非常灵活,可以修改SQL语句
  • 注意SelectCommand中like的写法,第一次写,还是查了半天资料的哈
  • 为了实现查询时的过滤,使用在SelectCommand中添加参数,以及使用ControlParameter邦定到输入框上

      2. 查询区域

Query By CategoryName:
<asp:TextBox ID="TextBoxCategoryName" runat="server"></asp:TextBox>
<asp:Button ID="ButtonQuery" runat="server" Text="Query" />
  • 添加一个按钮是为了刷新页面,以刷新SqlDataSource

      3. 添加GridView

<asp:GridView ID="GridView1" runat="server" Width="90%" AutoGenerateColumns="False" DataKeyNames="CategoryID" AllowPaging="true" PageSize="10"
DataSourceID
="SqlDataSource1" CellPadding="4" ForeColor="#333333" GridLines="None">
<Columns>
    
<asp:CommandField ShowSelectButton="True" />
    
<asp:BoundField DataField="CategoryID" HeaderText="CategoryID" InsertVisible="False"
        ReadOnly
="True" SortExpression="CategoryID" />
    
<asp:BoundField DataField="CategoryName" HeaderText="CategoryName" SortExpression="CategoryName" />
    
<asp:BoundField DataField="Description" HeaderText="Description" SortExpression="Description" />
    
<asp:CommandField ShowEditButton="True" ShowDeleteButton="True" />
</Columns>
</asp:GridView>
  • CommandField是2.0中新增属性,可以方便的实现操作。
  • 该GridView邦定到刚创建的SqlDataSource1

      4.添加DetailsView

<asp:DetailsView ID="DetailsView1" runat="server" AutoGenerateRows="False" DataKeyNames="CategoryID" Width="90%"
DataSourceID
="SqlDataSource1" CellPadding="4" ForeColor="#333333" GridLines="None" HeaderText="Details">
<Fields>
    
<asp:BoundField DataField="CategoryName" HeaderText="CategoryName" SortExpression="CategoryName">
        
<ItemStyle Width="90%" />
    
</asp:BoundField>
    
<asp:BoundField DataField="Description" HeaderText="Description" SortExpression="Description" />
    
<asp:CommandField ShowDeleteButton="True" ShowEditButton="True" ShowInsertButton="True" />
</Fields>
</asp:DetailsView>
  • DetailsView同样也邦定到SqlDataSource1

     5.实现选中GridView时DetailsView显示值连动操作

this.DetailsView1.PageIndex = this.GridView1.SelectedRow.DataItemIndex;
  • 添加GrideView1的SelectedIndexChanged事件,在实践中填入上面代码,这是整个页面中唯一一个需要后台编码的地方,应该有其他方法可以实现这个操作。

      整个页面实现起来非常简单,试试看,是不是只要10分钟。
      先不说asp.net 2.0给负责的逻辑处理带来了什么好处,就类似于这种页面的体力活,确实帮我们省了不少!


使用GridView加DetailsView实现查询,新增,编辑,删除

数据库:NorthwindTable :Categories 下面的操作将实现下图...
  • zhangjingv
  • zhangjingv
  • 2008年05月05日 23:50
  • 696

ASP.net中的AJAX学习记录六 无刷新的数据编辑(GridView和DetailsView结合实例)(转)

本篇博客是仿照书中实例,实现GridView和DetailsView结合无刷新的数据编辑效果,页面效果:当点击GridView1的行或换页时,都会引发DetailsView1的数据绑定显示至页面,同时...
  • lonely_wm
  • lonely_wm
  • 2014年11月26日 23:42
  • 897

选择GridView的一行,用DetailsView显示详细内容

源码位置:http://download.csdn.net/detail/weinierbian/4426673 我们先要配置好一个sqldatasource,假设为sqldatasource1,再...
  • weinierbian
  • weinierbian
  • 2012年07月13日 12:00
  • 3518

如何设置DetailsView模板列里的下拉菜单

这个问题在做PC管理OA的时候困扰了我几天,到csdn上问也没有获得比较满意的答复.比较有用的就是知道了用下列语句取得下拉菜单: DropDownList ddl = (DropDownList)De...
  • angleoldhen
  • angleoldhen
  • 2006年10月19日 16:52
  • 2502

DetailsView控件

http://zhangruidq.blog.163.com/blog/static/56083551200911243458162/ 一 自动换行DetailsView1.Attributes.Ad...
  • plean
  • plean
  • 2011年06月16日 17:13
  • 1482

GridView自带删除编辑功能的事件编写

 protected void GridColumn_RowDeleting(object sender, GridViewDeleteEventArgs e)    ...{        //获取...
  • windxxf
  • windxxf
  • 2008年04月26日 12:36
  • 2494

使用DetailsView单页编辑控件

前台:                 测试页面                                     ...
  • zunguitiancheng
  • zunguitiancheng
  • 2014年03月25日 11:14
  • 733

ASP.NET使用GridView控件、DetailsView控件

ASP.NET使用GridView控件绑定列表信息、DetailsView控件绑定详细信息。 1、 使用GridView完成用户列表的显示 使用GridView完成用户列表的绑定、分页、数据修改、...
  • pan_junbiao
  • pan_junbiao
  • 2013年02月14日 16:40
  • 3374

gridView(二)实现手动数据源的编辑、删除

在上一篇博客中举的例子是用的sqldatasource作为数据源的,但是在实际中,我们还是往往要用到手动的数据源的,这篇博客就来说说如果用手动数据源来为gridview编辑、删除数据。 说明: 1...
  • yjjm1990
  • yjjm1990
  • 2012年07月16日 20:38
  • 1964

DetailsView 的用法(与GridView 一起使用)

特点:  一次只显示一条,而且分页也是跳到下一条数据.显示数据的格式与GridView 差不多,表格显示,很规范,很难任意布局FormView 与 DataList 差不多,可以任意布局, 可以说随心...
  • mndn_nana
  • mndn_nana
  • 2007年11月05日 11:50
  • 1350
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:使用GridView加DetailsView实现查询,新增,编辑,删除
举报原因:
原因补充:

(最多只允许输入30个字)