《Web数据访问》PPT课件.ppt

《《Web数据访问》PPT课件.ppt》由会员分享，可在线阅读，更多相关《《Web数据访问》PPT课件.ppt（66页珍藏版）》请在三一办公上搜索。

1、第8章 Web数据访问,Web应用开发技术,2023/7/8,Web应用开发技术,第8章 Web数据访问,8.1 数据源控件 8.2 GridView控件 8.3 DataList控件 8.4 DetailsView控件,2023/7/8,Web应用开发技术,8.1 数据源控件,8.1.1 数据源控件概述 8.1.2 SqlDataSource控件,2023/7/8,Web应用开发技术,8.1.1 数据源控件概述,ASP.NET中参与数据绑定的有两类服务器控件：数据源(DataSource)控件和数据绑定控件。这些控件完成Web数据访问的基础任务。ASP.NET包含一些DataSource控件

2、。这些DataSource控件不呈现任何用户界面，而是充当不同类型数据源与网页上其他界面控件之间的中间方。DataSource控件对象可以用声明的方式(在网页文件中)或者以编程的方式(在代码隐藏文件中)定义。,2023/7/8,Web应用开发技术,8.1.1 数据源控件概述,使用DataSource控件可以连接到数据源，无需编写代码即可实现以下功能：从数据源中检索数据；设置页面行为(如排序、分页、缓存等)；更新、插入和删除数据；使用运行时参数筛选数据；允许其他界面控件绑定到DataSource控件，以便在网页中显示数据。,2023/7/8,Web应用开发技术,8.1.1 数据源控件概述,ASP

3、.NET包含支持不同数据绑定方案的DataSource控件，包括：ObjectDataSource：连接中间层对象或数据接口对象，使用ObjectDataSource可以创建依赖于中间层对象来管理数据的Web应用程序。SqlDataSource：连接ADO.NET托管数据提供程序，完成对SQL Server、Oracle、OLE DB或ODBC数据源的访问。AccessDataSource：连接Access数据库。XmlDataSource：连接XML数据源文件，一般为诸如TreeView或Menu等层次结构控件提供数据。SiteMapDataSource：与ASP.NET站点导航结合使用。,

4、2023/7/8,Web应用开发技术,8.1.1 数据源控件概述,DataSource控件不呈现任何用户界面，用户界面功能由数据绑定控件完成。数据绑定控件可以绑定到DataSource控件，并自动在页面请求生命周期的适当时机获取数据。数据绑定控件通过其DataSourceID属性连接到DataSource控件，然后即可利用DataSource控件所提供的功能，包括排序、分页、缓存、筛选、更新、删除和插入等。ASP.NET提供专用的数据绑定控件，如DataList、DetailsView、GridView和FormView等，本章的重点是介绍前3种专用数据绑定控件，,2023/7/8,Web应用

5、开发技术,8.1.2 SqlDataSource控件,SqlDataSource 控件使用SQL命令来检索和修改数据，可用于SQL Server、Oracle、OLE DB和ODBC等数据源。SqlDataSource控件可将检索结果作为DataReader或DataSet对象返回。当结果作为DataSet返回时，还可以对结果进行排序、筛选和缓存等操作。为网站创建一个新的页面StudentManage1。最终要在此页面上完成对学生信息的管理。,2023/7/8,Web应用开发技术,8.1.2 SqlDataSource控件,在工具箱的“数据”页中拖动一个SqlDataSource控件到页面上来

6、，切换到设计视图，可以看到一个可视化的SqlDataSource控件。将鼠标移动到该控件右上角，可以看到一个小三角标记，该标记称为SqlDataSource控件的“智能标签”。单击智能标签，可以打开一个上下文相关的菜单，初始时如图 所示。,2023/7/8,Web应用开发技术,8.1.2 SqlDataSource控件,单击“配置数据源”，弹出配置数据源向导，用户可在该向导的引导下，对数据源进行配置。该向导的第1步是“选择你的数据连接”。因为目前本网站还没有创建到数据库的连接，因此，需要按“新建连接”按钮，进入“添加连接”对话框，添加一个新的数据库连接，如图所示。,2023/7/8,Web应用

7、开发技术,8.1.2 SqlDataSource控件,按“测试连接”按钮进行测试，如果测试成功，则可按“确定”按钮返回配置数据源向导，按“下一步”继续。向导提示“将连接字符串保存到应用程序配置文件中”，如图所示。选择“是”复选框，将连接字符串的名称改为SQLConnectionString，按“下一步”继续。,2023/7/8,Web应用开发技术,8.1.2 SqlDataSource控件,在“配置Select语句”步骤，界面如图 所示。,2023/7/8,Web应用开发技术,8.1.2 SqlDataSource控件,在“测试查询”步骤，按“测试查询”按钮，如果示例数据库已经建立且前述步骤都

8、配置正确，应该能够显示结果数据集，如图所示。按“完成”按钮，完成对数据源的配置。数据源配置完成后，可以看到网站项目中新增加了一个Web.Config文件。打开它，可以看到其中有已经配置好的数据库连接字符串SQLConnectionString。,2023/7/8,Web应用开发技术,第8章 Web数据访问,8.1 数据源控件 8.2 GridView控件 8.3 DataList控件 8.4 DetailsView控件,2023/7/8,Web应用开发技术,8.2 GridView控件,8.2.1 常用属性和事件 8.2.2 GridView控件的基本应用 8.2.3 通过GridView控件

9、修改数据 8.2.4 多个GridView和SqlDataSource相互配合 8.2.5 对GridView控件编程,2023/7/8,Web应用开发技术,8.2.1 常用属性和事件,使用GridView控件可以在“表”中显示数据源的值，其中每列表示一个字段，每行表示一条记录。GridView 控件还允许选择和编辑这些项以及对它们进行排序。GridView控件包括很多属性和事件，方便用户对其进行灵活的设计期配置及运行期程序控制。,2023/7/8,Web应用开发技术,8.2.1 常用属性和事件,2023/7/8,Web应用开发技术,8.2.1 常用属性和事件,2023/7/8,Web应用开发

10、技术,8.2.1 常用属性和事件,2023/7/8,Web应用开发技术,8.2.2 GridView控件的基本应用,从工具箱中拖一个GridView控件到页面上来。切换到设计视图，单出GridView控件的智能标签，在“选择数据源”中选择SqlDataSource1，可以看到设计视图中的GridView控件外观发生了变化，主要是为STUDENT表的各字段生成了对应的绑定列。再次打开GridView控件的智能标签，选择“启用分页”。执行页面，运行效果如图 所示。,2023/7/8,Web应用开发技术,8.2.2 GridView控件的基本应用,GridView控件提供了众多属性用于外观控制，如B

11、ackColor、ForeColor、BorderColor等，完全可以通过手工配置这些属性来达到个性化的完美显示效果。但也许不必这么辛苦就能达到相当专业的显示效果。再次打开GridView控件的智能标签，选择“自动套用格式”，弹出如图 的对话框。用户可以在左侧的“选择方案”列表中选择一种系统预置的外观方案(如“石板”)，如果预览效果满意，按“确定”按钮回到设计视图，即可以看到外观的改善。,2023/7/8,Web应用开发技术,8.2.2 GridView控件的基本应用,手工修改各字段的HeaderText属性，将其改为中文。再次执行页面，效果如图所示。,2023/7/8,Web应用开发技术,

12、8.2.3 通过GridView控件修改数据,在设计视图中打开SqlDataSource1的智能标签，选择“配置数据源”，可对数据源进行进一步的配置。按“下一步”，到达“配置Select语句”步骤。按“高级”按钮，在“高级SQL生成选项”对话框中选择“生成INSERT、UPDATE和DELETE语句”复选框。再次打开GridView控件的智能标签，选择“编辑列”，弹出“字段”对话框。在“可用字段”列表中选择CommandField，按“添加”按钮，CommandField出现在“选定的字段”列表中。再次执行页面，效果如图所示。,2023/7/8,Web应用开发技术,8.2.4 多个GridVi

13、ew和SqlDataSource相互配合,ASP.NET提供了多个GridView和多个SqlDataSource相互配合的能力。配合的方式可以有很多，可以达到丰富的功能效果.拖一个GridView控件到页面上原有内容的下部，可以看到其ID为GridView2。在设计视图上单击GridView2的智能标签，在“选择数据源”列表中选择“新建数据源”，进入数据源配置向导，如图 所示。,2023/7/8,Web应用开发技术,8.2.4 多个GridView和SqlDataSource相互配合,选择“数据库”，接受指定的数据源ID，按“确定”按钮继续。在“选择你的数据连接”步骤选择前节创建的SQLCo

14、nnectionString，按“下一步”按钮继续。在“配置Select语句”步骤选择“指定来自表或视图的列”，选择STUDENT_CLASS表的所有列。与前节不同的是，需要为Select语句定义WHERE子句。执行页面，可以看到：当单击一个学生的“所选课程”按钮时，页面的下部就会列出他所选的课程列表。,2023/7/8,Web应用开发技术,8.2.5 对GridView控件编程,可以针对GridView进行编程，来实现更加丰富的功能。为UseGridView网站创建一个新的页面StudentManage2，目的是用另一种方法完成对学生信息的管理。下面针对不同的功能要求，为该页面编写程序。首先

15、，如果用户没有要求修改或新增学生信息，页面下部的Panel1部分应该是不显示的。,2023/7/8,Web应用开发技术,8.2.5 对GridView控件编程,介绍另一种进入控件事件编程的方法：在设计视图上选中GridView1控件，单击“属性”窗口上部的闪电图标，窗口中列出GridView1控件的所有事件。双击RowDataBound行，系统会自动转到代码隐藏文件中，并为GridView1的RowDataBound事件增加处理函数，默认的函数名为 GridView1_RowDataBound。执行页面，界面如图所示。,2023/7/8,Web应用开发技术,小结,当需要列表、分页、排序显示大量

16、数据时，使用GridView控件是一个很好的选择。GridView控件本身提供了很强的功能，还可以通过编程的方式完成对数据更复杂的操作。由于控件本身提供了内置的分页、排序等功能，因此，GridView控件适合于管理记录较多的数据库表。由于GridView控件封装良好，从另一个方面来看，不容易在字段上增加各种灵活操作，因此适合于对没有更多关联关系的数据库表的管理。,2023/7/8,Web应用开发技术,第8章 Web数据访问,8.1 数据源控件 8.2 GridView控件 8.3 DataList控件 8.4 DetailsView控件,2023/7/8,Web应用开发技术,8.3 DataL

17、ist控件,8.3.1 DataList控件的模板和事件 8.3.2 DataList控件的基本应用 8.3.3 对DataList控件编程实现数据修改和删除8.3.4 对DataList控件编程实现数据添加,DataList控件概述,DataList控件用于在重复的列表中显示数据项，并且支持对这些项进行选择和编辑。DataList中列表项的内容和布局是使用模板定义的，可以为项、交替项、选定项和编辑项创建模板；也可以使用标题、脚注和分隔符模板自定义DataList的整体外观。DataList可以 多列显示数据。DataList无内置分页、排序等功能，适合管理数据不太多的数据源。,2023/7/

18、8,Web应用开发技术,8.3.1 DataList控件的模板和事件,DataList控件可用于模板化地列表显示数据，可用自定义的格式显示数据库的各行信息。使用DataList控件，可通过所创建的模板来定义数据显示布局。所谓模板，就是用来控制显示数据库中每条记录的HTML。DataList控件可用于列表操作任何重复结构中的数据，它使用HTML的table元素在列表中显示数据记录。但是，若要更精确地控制用于显示的HTML，可以选择使用Repeater控件.,2023/7/8,Web应用开发技术,8.3.1 DataList控件的模板和事件,2023/7/8,Web应用开发技术,8.3.1 Dat

19、aList控件的模板和事件,每个模板都支持其自己的样式对象，样式对象包含一系列外观属性的定义，可以在设计时和运行时进行设置。与上表相对应，样式对象包括：ItemStyleAlternatingItemStyleSelectedItemStyleEditItemStyleHeaderStyleFooterStyleSeparatorStyle,2023/7/8,Web应用开发技术,8.3.1 DataList控件的模板和事件,DataList控件支持的公共事件,8.3.2 DataList控件的基本应用,1、显示数据2、格式化各个模版3、多列显示4、定制各个模版,2023/7/8,Web应用开发

20、技术,1、使用DataList控件显示数据,首先，创建一个称为SqlDataSource1的数据源。其次，在界面上放置一个DataList控件。然后，为datalist选择数据源。此时，会自动生成datalist的结构，主要是增加了对数据源的绑定和生成了ItemTemplate模板。最后，启动调试就可以看的数据。返回源码试图查看DataList的源码,2、格式化datalist,主要方法有：1）使用 datalist智能任务导航中的自动套用格式。2）通过格式化各个模版进行定制。A)在属性窗口中格式化。B)在智能任务导航中的属性生成器。C)在源代码中手工修改。,2、格式化datalist,A)在

21、属性窗口中格式化选择DataList，然后在右侧属性窗口中选择对应属性进行格式设置,2、格式化datalist,B)在智能任务导航中的属性生成器,2、格式化datalist,C)在源代码中手工修改如上图所示，可以在源码中增加各个模版的style项也可以在各个模版的源码或者模版内部控件上使用各种HTML标签，比如Font、Div、CSS等,3、多列显示数据,在DataList属性面板中利用属性进行重复列的设置和重复方向设置,4、定制各个模版,个性化各个模板，两种方式：界面中修改，复制或者添加控件代码修改一般是添加显示数据的label或者textbox控件和对数据进行编辑的button按钮控件。在

22、进行数据显示的时候，可以使用其他控件进行排版，必然tabel、panel等。手工代码方式比较方便，但界面方式简单。,4、定制各个模版,界面方式定制首先：利用智能任务导航进入模版编辑状态。其次：选择一种模版视图。再次：在模版中添加控件或者从别的模版试图中复制控件。最后：设置控件。,4、定制各个模版,界面方式定制注意：为TextBox控件设置数据源显示字段。选择控件，然后利用智能任务导航，选择“编辑”，然后在弹出的对话框中进行设置。,4、定制各个模版,代码方式定制可以在上面代码中直接书写控件源码。一般是从ItemTemplate中复制内容，然后修改，比如把label修改为TextBox等等。,20

23、23/7/8,Web应用开发技术,8.3.3 对DataList控件编程,小节已经做到了以比较美观的形式对数据进行显示，但还不能对数据进行修改。即使编辑多个模版，也只能看到两个模版，像EditTemplate、SelectedTemplate等都看不到。按上节的方法，为数据源“生成INSERT、UPDATE和DELETE语句”。利用DataList控件也可以完成数据项的就地编辑功能，效果甚至比GridView控件的就地编辑功能(不推荐使用)还要好，但需要付出更多的手工劳动。,8.3.3 对DataList控件编程,进入选中和编辑状态第一、设置相应按钮，并触发事件。因为按钮在DataList模版

24、中，属于DataList的子控件。因此不能直接触发事件，需要特殊处理。首先，设置按钮的commandname属性为某一个动作，比如select、edit、delete、update、cancel等。该名称对应DataList的一个事件。也可以设置其他标识名称。,8.3.3 对DataList控件编程,其次，设置DataList控件对应的事件属性。双击该名称既可得到对应事件过程。如果各个button按钮设置了其他的commandname属性，那么可以使用ItemCommand事件过程，然后在该事件中通过mandname来判断是触发的哪一个按钮。,8.3.3 对DataList控件编程,第二、在事

25、件过程中设置datalist状态。通过两个属性设置选中和编辑状态：SelectedItemIndex和EditItemIndex，如果属性值为-1，则取消选中或编辑状态，否则，就置对应序号的记录为选中或编辑状态。DataList1.EditItemIndex=;,8.3.3 对DataList控件编程,第三、删除记录、更新记录。修改数据只能通过DataList对应的数据源控件sqlDataSource来实现。利用上节课GridView的编辑方式，对sqlDataSource对应的命令参数赋值，然后调用方法即可。注意：模版中的控件，在事件过程中无法直接获得，必须通过findcontrol方法获得

26、ID，并进行类型转换。比如(TextBox)e.Item.FindControl(“txtUserName”).Text;,2023/7/8,Web应用开发技术,8.3.4 进一步对DataList控件编程,可以按照上节介绍的方法：为页面增加一个“新增”按钮和一个Panel控件，当按“新增”按钮时控制Panel控件可见并在其上输入新记录的数据。为网站再创建一个新的页面ManagerManage3，继续增加对数据的插入功能。增加一个table控件。两个普通HTML按钮的单击事件处理函数采用JavaScript编程，为“保存”按钮的单击事件编写服务器端处理函数。（参考教材P188-189代码）,2

27、023/7/8,Web应用开发技术,第8章 Web数据访问,8.1 数据源控件 8.2 GridView控件 8.3 DataList控件 8.4 DetailsView控件,2023/7/8,Web应用开发技术,8.4 DetailsView控件,8.4.1 常用属性和事件 8.4.2 DetailsView控件的示例 8.4.3 DetailsView和GridView组合使用,2023/7/8,Web应用开发技术,8.4.1 常用属性和事件,前两节介绍的GridView控件和DataList控件都是以列表的形式一次显示多条记录。但在实际应用中经常需要一次只处理一条记录，ASP.NET提供

28、了一些专门处理这种情况的控件，DetailsView就是其中之一。使用DetailsView控件可以显示数据库表中一条记录的信息，还可以执行编辑、删除和插入等操作。,2023/7/8,Web应用开发技术,8.4.1 常用属性和事件,2023/7/8,Web应用开发技术,8.4.1 常用属性和事件,2023/7/8,Web应用开发技术,8.4.1 常用属性和事件,2023/7/8,Web应用开发技术,8.4.1 常用属性和事件,2023/7/8,Web应用开发技术,8.4.2 DetailsView控件的示例,DetailsView控件可以触发许多与用户交互相关的事件，也就是说可以通过编程对数据

29、库表中的单条记录实现丰富、细致的操作。创建一个新的页面TeacherManage1。最终要在此页面上完成对教师信息的管理。从工具箱拖一个DetailsView控件到页面上来，切换到设计视图，打开DetailsView1的智能标签，按照前文的方法，新建一个称为SqlDataSource1的数据源。为DetailsView1创建了数据源后，在设计视图中可以看到其预览形式已经发生了变化显示了记录的所有字段。执行页面，界面如图 所示。,2023/7/8,Web应用开发技术,8.4.2 DetailsView控件的示例,在设计视图DetailsView1的智能标签中，将“启用分页”、“启用插入”、“启用

30、编辑”和“启用删除”全部选中。在“编辑字段”对话框中将命令字段的ButtonType属性“Button”。自动套用“秋天”格式。将DetailsView1的HorizontalAlign属性改为“Center”。在源视图将字段标题改为中文。再次执行页面，界面如图所示。,2023/7/8,Web应用开发技术,8.4.2 DetailsView控件的示例,DetailsView控件封装良好，具有完备的数据浏览与维护功能，基本不需要编程处理。但是，由于数据记录之间的切换完全依靠分页导航来完成，因此只能适用于数据量很少，管理要求不高的情况。功能上与DetailsView相似(同样是针对单个记录进行管理

31、)，但封装程度比DetailsView低(与DataList相似)的另一个控件是FormView控件。,8.4.3 DetailsView和GridView组合使用,GridView可以一次性显示多条记录，但是编辑能力弱，而DetailsView一次显示一条记录，编辑能力强。可以借助DetailsView来实现对GridView中数据的编辑。此时需要两个数据源控件，DetailsView和GridView的交互是通过其数据源控件来实现的,8.4.3 DetailsView和GridView组合使用,步骤：1、分别添加一个sqlDataSource控件和GridView控件，来显示一个表中数据，

32、为其增加选择按钮。2、添加一个sqlDataSource控件作为DetailsView的数据源，跟GridView控件处理同一个表。3、配置该数据源控件，让改数据源显示GridView控件中选中的数据，如下图所示。同时生成对应的Insert、Delete、Update语句。,8.4.3 DetailsView和GridView组合使用,8.4.3 DetailsView和GridView组合使用,4、添加DetailsView控件，并为其设置数据源。同时启用插入、编辑和删除。5、为GridView控件的选择按钮对应的事件编写代码，调用DetailsView的databind方法。6、同时还需要对DetailsView控件对应的删除和编辑、插入数据后的确定按钮编写事件，对GridView控件调用databind方法。,