码迷,mamicode.com
首页 > Web开发 > 详细

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

时间:2014-05-19 10:40:57      阅读:277      评论:0      收藏:0      [点我收藏+]

标签:blog   class   code   c   java   tar   

本篇博客是仿照书中实例,实现GridView和DetailsView结合无刷新的数据编辑效果,页面效果:当点击GridView1的行或换页时,都会引发DetailsView1的数据绑定显示至页面,同时当使用DetailsView1编辑、删除、添加时,也会引起GridView1的重新绑定,整体页面实现无刷新。

         页面布局:

        1.新建AJAX窗口,命名为:“NoRefreshEdit.aspx”。要想实现页面无刷新编辑,就必须使用两个Updatepanel。

        2.在NoRefreshEdit.aspx页面中加入一个一行二列的表,分别在每个单元格中放入一个Updatepanel。

        3.在Updatepanel1中加入一个表,最好加入一个数据数较多的表,方便你体会换页的刷新效果,我使用的是tb_info表,按照我习惯的做法,直接将它拖入到Updatepanel1中,自动生成绑定好的GridView1和sqldatasource1.开启GridView1中的选择、分页功能。

        4.在Updatepanel2中放置一个sqldatasource2,将sqldatasource2的连接字符串也绑定到tb_info表上,开始配置sqldatasource2。单击“高级”按钮,选中生成Insert、Update、Delete语句,单击“where”按钮,将ID绑定为GridView1的SelectedValue事件触发的id值。

bubuko.com,布布扣

bubuko.com,布布扣

        5.拖放一个DetailsView1放入Updatepanel2中,将DetailsView1的数据源配置为sqldatasource2,启动编辑、删除、插入功能。

        6.将Updatepanel1的UpdateMode属性改为:conditional;将Updatepanel2的UpdateMode属性也改为conditional,同时在Updatepanel2的Triggers中加入两个Async-Postback,ControlID都是GridView1,Eventname分别是SelectedIndexChangedPageIndexChanged,也就是说,当GridView1选择行和页码改变后,都会发生Updatepanel2的刷新,同时DetailsView1也会显示出来。

         页面布局到此,下面看一下cs代码:

bubuko.com,布布扣
bubuko.com,布布扣
 1bubuko.com,布布扣public partial class NoRefreshEdit : System.Web.UI.Page
 2bubuko.com,布布扣{
 3bubuko.com,布布扣    protected void Page_Load(object sender, EventArgs e)
 4bubuko.com,布布扣    {
 5bubuko.com,布布扣
 6bubuko.com,布布扣    }

 7bubuko.com,布布扣    protected void DetailsView1_ItemDeleted(object sender, DetailsViewDeletedEventArgs e)
 8bubuko.com,布布扣    {
 9bubuko.com,布布扣        GridView1.DataBind();
10bubuko.com,布布扣        UpdatePanel1.Update();
11bubuko.com,布布扣    }

12bubuko.com,布布扣    protected void DetailsView1_ItemInserted(object sender, DetailsViewInsertedEventArgs e)
13bubuko.com,布布扣    {
14bubuko.com,布布扣        GridView1.DataBind();
15bubuko.com,布布扣        UpdatePanel1.Update();
16bubuko.com,布布扣    }

17bubuko.com,布布扣    protected void DetailsView1_ItemUpdated(object sender, DetailsViewUpdatedEventArgs e)
18bubuko.com,布布扣    {
19bubuko.com,布布扣        GridView1.DataBind();
20bubuko.com,布布扣        UpdatePanel1.Update();
21bubuko.com,布布扣    }

22bubuko.com,布布扣}

23bubuko.com,布布扣
bubuko.com,布布扣

     那什么要编写这两行的代码,原因有二:1.DetailsView1并非是Updatepanel1的Triggers,所以它的任何动作不会刷新Updatepanel1控件,2.即使DetailsView1成为了Updatepanel1的Triggers,它的动作可以导致Updatepanel1的刷新,Updatepanel1刷新时也会因为GridView1控件没有重新绑定sqldatasource1,而持续显示上一次的列表。所以我们要同时让Updatepanel1刷新,也要让GridView1重新绑定。

     当Updatepanel的UpdateMode改为conditional时,除了可以使用Triggers中设定来要求何时刷新外,还可以直接于程序代码中调用其update函数来要求该Updatepanel刷新。

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

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

标签:blog   class   code   c   java   tar   

原文地址:http://www.cnblogs.com/mengEx/p/3731777.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!