《静态网页设计教程(5数据绑定与显).ppt》由会员分享，可在线阅读，更多相关《静态网页设计教程(5数据绑定与显).ppt（31页珍藏版）》请在金锄头文库上搜索。
1、静态网页设计教程静态网页设计教程静态网页设计教程静态网页设计教程学习情境五学习情境五数据绑定与显示数据绑定与显示回顾2-1nTreeView控件绑定数据的方式是什么？指定DataSourceIDn数据访问层有哪四类常见方法？C、R、U、Dn在ASP.NET中调用客户端脚本，有哪几种方法？注册客户端脚本页面输出脚本控件的Text中输出脚本n下面是注册用户的部分代码，检查有什么问题。回顾2-2User user = new User( );user.LoginId = this.txtLoginId.Text;user.LoginPwd = this.txtLoginPwd.Text;if (Us
2、erManager.LoginIdExists(user.LoginId) this.Page.ClientScript.RegisterStartupScript(this.GetType( ), , alert(用户名或者密码错误！用户名或者密码错误！););UserManager.AddUser(user);此处应该使用单引号此处应该使用单引号预习检查GridView控件有哪两种数据绑定方式？有哪几种数据源控件？本章任务n完成书籍分类维护模块图书列表分页可多选，实现多个图书分类的调整高亮显示鼠标所在行（光棒效果）图书详细显示页面本章目标n能熟练使用GridView进行数据的查询与展示n熟
3、练使用ObjectDataSource控件绑定业务逻辑层返回的对象数据展示n数据展示的两种实现方法使用数据源控件，可以实现快速开发使用数据源控件，可以实现快速开发手写手写代码实现代码实现简单简单设置实现设置实现ADO.NET数据数据源控件源控件Web服务器服务器数据库数据库展示数据展示数据什么是数据源控件？什么是数据源控件？数据源控件n快速实现多种常用的数据源进行展示和交互n快速完成对数据表增删改查操作n是ASP.NET2.0引入的一个新的数据抽象层学习过的学习过的数据源控件数据源控件“面包屑面包屑”导航控件使用的导航控件使用的SiteMapDataSourceTreeView导航控件使用的导
4、航控件使用的XmlDataSource数据源控件nVS2005内置的五种数据源控件SqlDataSourceAccessDataSourceObjectDataSourceXmlDataSourceSiteMapDataSourceSqlDataSource允许访问支持允许访问支持ADO.NET数据提供程序的所有数据提供程序的所有数据源。可访问数据源。可访问ODBC、SQL Server等等ObjectDataSource可以可以对业务对象或其他返回数据对业务对象或其他返回数据的类执行特定的数据访问的类执行特定的数据访问XmlDataSource可以对可以对XML文档执行特定访问，文档执行特定
5、访问，包括物理访问和内存访问。包括物理访问和内存访问。SiteMapDataSource可以对站点地图可以对站点地图提供程序所存储的提供程序所存储的Web站点执行站点执行特定的站点地图数据访问特定的站点地图数据访问数据源控件n数据源控件类的层次结构图：Control类类普通数据源控件普通数据源控件层次化数据源控件层次化数据源控件ObjectDataSourceSqlDataSourceSiteMapDataSourceXMLDataSourceAccessDataSource所有数据源控件都派生于所有数据源控件都派生于Control类类ObjectDataSource重要属性属性名称属性名称说
6、明说明SelectMethod获取或设置由检索数据的方法或函数的名称。InsertMethod获取或设置插入数据的方法或函数的名称。UpdateMethod获取或设置由更新数据的方法或函数的名称。DeleteMethod获取或设置删除数据的方法或函数的名称。TypeName获取或设置ObjectDataSource对象表示的类的名称，即业务对象的类名。手写代码方式this.gvMain.DataSource = UserManager.GetAllUsers( );this.gvMain.DataBind( );获取数据的方法获取数据的方法展示数据的控件展示数据的控件指定数据集合指定数据集合数
7、据绑定方法数据绑定方法n注意：数据源控件方式只要指定数据源id即可；DataSource方式在指定完数据源后必须使用绑定方法。数据绑定控件n数据绑定控件可以用来展示和绑定数据数据源控件不提供展示，数据绑定控件提供展示数据绑定控件可以通过数据源控件绑定数据n数据绑定控件的层次结构小结n三层结构下，采用哪个数据源控件比较合适？n说明五种数据源控件各自的作用。图书分类管理n第三波网络书店的图书分类管理图书列表显示，显示标题和分类图书列表显示，显示标题和分类分页分页详情详情多选效果多选效果光棒效果光棒效果分类修改功能分类修改功能数据展示nJSP中如何显示列表信息？读取数据循环记录集，组合HTML代码（
8、使用标签库或者硬编码）n.NET中的数据绑定控件能够将控件绑定到一个数据结果集能够使用模板自定义控件的布局和样式提供用于处理和取消事件的方便模型GridView控件n使用GridView显示图书信息列表1、将GridView控件拖入页面。2、添加并指定ObjectDataSource数据源。3、编辑列，选择需要显示的字段，并可设置表头等。4、设置分页。5、运行，查看效果。演示示例：演示示例： 图书列表图书列表 绑定列nBoundField字段表示数据绑定控件中作为文本显示的字段。可设置表头、样式等信息。DataFormatString，可设置显示字段的格式。注：注： 当当HtmlCode属性设
9、置为属性设置为false， DataFormatString才有效才有效 0:C0代表对应后面的第一个参数，这里就是绑定的字段所对应的值；代表对应后面的第一个参数，这里就是绑定的字段所对应的值； C是格式化标记，它可以将数字型的字段格式化为货币类型。是格式化标记，它可以将数字型的字段格式化为货币类型。绑定列nTemplateField字段绑定中显示自定义内容的字段有五种模板（标头、脚注、普通项、交替项、编辑模式） asp:TextBox ID=TextBox1 runat=server Text= asp:Label ID=Label1 runat=server Text= 绑定字段的方法，还
10、可以使用绑定字段的方法，还可以使用Eval注意单引号的使用注意单引号的使用Eval和BindnEval方法是只读方法该方法采用数据字段的值作为参数并将其作为字符串返回。当对表达式操作时候，必须用Eval如格式化nBind方法支持读/写功能可以检索数据绑定控件的值并将任何更改提交回数据库。d：日期；：日期；m：月份；：月份；y：年份。可能格式化为：年份。可能格式化为“17/05/2008”。 绑定列nButtonField字段显示为数据绑定控件中的按钮CommandName设置自定义命令（RowCommand）protected void gvBooks_RowCommand()if (e.Co
11、mmandName = Select) int index = Convert.ToInt32(e.CommandArgument); GridViewRow selectedRow = gvUser.Rowsindex; TableCell contactName = selectedRow.Cells1; 绑定列nCommandField一个特殊字段，显示了用于在数据绑定控件中执行选择、编辑、插入或删除操作的命令按钮自动生成命令，无须手写对应数据源的增改查删方法nHyperLinkField显示为超链接的字段比如链接到详细页面设置链接的路径格式设置链接的路径格式设定绑定的参数集合设定绑定的
12、参数集合绑定列nImageField字段为图像的字段绑定到包含图像URL的数据源中的字段指定DataImageUrlFieldnCheckBoxField字段以复选框显示的布尔型字段仅当数据源字段中有布尔型字段时使用此字段光棒效果protected void gvDemo_RowDataBound(object sender, GridViewRowEventArgs e) if (e.Row.RowType = DataControlRowType.DataRow) e.Row.Attributes.Add(onmouseover, currentcolor=this.style.backg
13、roundColor;this.style.bac kgroundColor=#6699ff); e.Row.Attributes.Add(onmouseout, this.style.backgroundColor=currentcolor); GridView数据数据行绑定事件行绑定事件判断数据行类型判断数据行类型当鼠标离开时当鼠标离开时数据行背景色还原数据行背景色还原 添加属性（客户端）：添加属性（客户端）：当鼠标移过的时，数据行背当鼠标移过的时，数据行背景色变成蓝色景色变成蓝色 多选效果function GetAllCheckBox(CheckAll)var items = docum
14、ent.getElementsByTagName(input); for(i=0; iitems.length;i+) if(itemsi.type=checkbox)itemsi.checked = CheckAll.checked;获得页面上标签获得页面上标签 为为Input的控件元素的控件元素 判断控件元素类判断控件元素类 型是否为复选框型是否为复选框 图书分类管理n完成图书分类管理模块的功能在页面相应位置放置下拉单（DropDownList）设置下拉单的数据源，并配置相关属性绑定数据源，使用ObjectDataSource控件设置需要显示的字段（DataTextField属性）设置值字
15、段（DataValueField属性）放置“修改”按钮，并编写单击事件的代码参考答案：参考答案： 图书分类管理图书分类管理 关键代码string sb =String.Empty;for (int i = 0; i this.gvBooks.Rows.Count; i+) CheckBox cb = (gvBooks.Rowsi.FindControl(chbSelect) as CheckBox; if (cb.Checked = true) sb += (gvBooks.Rowsi.FindControl(lblId) as Label).Text+,; string catagory =
16、 this.ddlCatagory.SelectedItem.Value;ChangeCatagory(sb, catagory);/实现更新图书分类的方法实现更新图书分类的方法遍历行，找到选中的项遍历行，找到选中的项 获得下拉单选中行的值获得下拉单选中行的值 详细页面n配合图书列表中的链接项，完成图书的详细页面显示几个常用的字段显示几个常用的字段 DetailsView控件n使用DetailsView控件完成图书详细信息的显示配置数据源定义数据方法-GetBookById(Int32id)设置参数获取方法，通过参数获取指定DetailsView的数据源为该数据源演示示例：演示示例：图书的详细页面图书的详细页面 小结n默写实现全选效果的javascript脚本n思路：获得参数（多选框对象）得到页面上所有的INPUT标签的集合遍历该集合并将符合条件的对象选中状态改为参数的选中状态总结n数据源控件有哪几个？n可否使用ObjectDataSource绑定数据访问层返回的DataSet？为什么？n为绑定的行添加脚本事件的方法是什么？nDropDownList控件的哪个属性可获取当前选择的项？
