下载文档原格式
4.0 使用GridView控件在Visual Studio 2010中，用户可以采用可视化的方式为页面插入GridView控件，也可以通过代码的方式插入GridView控件。
1．添加GridView控件在页面的【设计】视图中选择任意一个段落，然后即可从【工具箱】中选择【GridView控件】，将其插入到页面中，如图10-2所示。
图10-2 插入的GridView控件2．更改控件外观通过可视化的方法，可以方便地改变GridView控件的外观，为其应用各种模板样式。
选中GridView控件或将鼠标滑至GridView控件上方，然后即可单击控件右上角的【GridView 任务】按钮，如图10-3所示。
图10-3 单击任务按钮在弹出的【GridView 任务】菜单中执行【自动套用格式】命令，如图10-4所示。
图10-4 执行【自动套用格式】命令然后，即可在弹出的【自动套用格式】对话框中选择GridView控件的格式架构，如图10-5所示。
图10-5 选择套用的格式3．添加数据源数据绑定控件的最大特点就是允许方便地与数据库中的数据进行绑定，快速显示数据内容。
用同样的方式选择GridView控件，单击其右上角的【GridView 任务】按钮，打开【GridView 任务】菜单。
如果当前的项目已绑定了数据源，则在该菜单中【选择数据源】的菜单中即可显示这些数据源。
否则，开发者可以在【选择数据源】的菜单中选择“<新建数据源>”选项，连接一个新的数据源，如图10-6所示。
图10-6 新建数据源在弹出的【数据源配置向导】对话框中选择对应的数据源类型，然后即可设置数据源的编号索引，单击【确定】按钮，如图10-7所示。
图10-7 选择数据源在弹出的【配置数据源】对话框中单击【新建连接】按钮，建立一个新的数据源连接，如图10-8所示。
图10-8 新建数据源连接在弹出的【添加连接】对话框中，输入数据库服务器的名称，并选择服务器安全的验证方式，如图10-9所示。
4.0 定义控件自定义控件与用户控件不同，自定义控件需要定义一个直接或间接从Control 类派生的类，并重写Render方法。
在.NET框架中，System.Web.UI.Control与System.Web.UI.WebControls.WebControl两个类是服务器控件的基类，并且定义了所有服务器控件共有的属性、方法和事件，其中最为重要的就是包括了控制控件执行生命周期的方法和事件，以及ID等共有属性。
1．创建项目使用自定义Label控件的代码，Web Control Library模板中默认包括该控件。
该控件是从Web Control类派生的，其行为与标准的Label控件相同，同时具有添加的属性将Text属性的值呈现为超级链接。
例如，在【文件】菜单中，执行【新建项目】命令，并弹出【新建项目】对话框，如图8-8所示。
在【模板】窗格中，选择Web选项，并在右侧选择【服务器控件】选项。
然后，将【名称】更改为Control，并单击【确定】按钮。
图8-8 自定义控件2．添加类控件在【解决方案资源管理器】中，右击项目文件，并执行【添加】|【新建项】命令，如图8-9所示。
图8-9 添加新项在弹出的【添加新项-Control】窗口中，选择【Visual C#项】模板，并选择【类】选项。
然后，修改【名称】为Address.cs，并单击【添加】按钮，如图8-10所示。
图8-10 添加类文件此时，在Address.cs文件中，添加一些地址的属性内容。
例如，城市名称、邮政编码、国籍等等。
现代码内容。
代码编写完成后，可以编译控件。
其实，编译控件的方法非常简单，如分别选择Address.cs和Custom.cs文件，并执行【生成】|【生成Control】命令，如图8-11所示。
图8-11 生成Control类3．将控件添加到工具箱生成Control类之后，可以将该类文件添加到工具箱中。
这样用户可以像使用工具栏中的控件一样，直接引用到窗体页中。
4.0 使用DataList控件使用DataList控件绑定数据，与插入GridView控件绑定数据的方法类似，用户可以在创建的窗体页中，插入相应的控件，并设置格式、添加数据源等等。
1．插入DataList控件在创建的站点中，打开需要添加该控件的文件，并选择【设计】视图。
然后，在工具箱的【数据】类中，选择DataList控件，并拖动到页面的合适位置，如图10-19所示。
图10-19 插入的DataList控件2．套用格式添加控件之后，可以在提示框中设置该控件的格式，如单击控件右上角的【DataList任务】按钮，并单击【自动套用格式】链接，如图10-20所示。
图10-20 单击任务按钮然后，在弹出的【自动套用格式】对话框中，选择【选择架构】列表中的控件格式，如图10-21所示。
图10-21 选择套用的格式3．添加数据源同样，在【DataList 任务】提示框中，选择【选择数据源】后面列表中【<新建数据源>】选项，如图10-22所示。
图10-22 新建数据源在弹出的【数据源配置向导】对话框中，可以选择该控件需要绑定的数据库，如Access数据库、Entity、LINQ、XML等数据源类型。
例如，在该向导对话框中，选择SQL数据，而在【为数据源指定ID】文本框中，自动产生数据源ID名称，单击【确定】按钮，如图10-23所示。
图10-23 选择数据源在弹出的【配置数据源】对话框中，用户可以从下拉列表中选择已经建立连接的数据库，单击【下一步】按钮，如图10-24所示。
或者，用户也可以单击【新建连接】按钮，建立一个新的数据源连接。
图10-24 选择数据源连接在弹出【配置Select语句】向导框中，将显示所选择数据库中，数据表及字段列表内容。
用户可以选择从数据库中检索数据的方式，如“指定算定义SQL语句或存储过程”和“指定来自表或视图的列”两种方式。
例如，选择“指定来自表或视图的列”检索数据方式，则可以指定列或者通过SQL语句筛选检索的范围和条件，如图10-25所示。
4.0 绑定控件与数据源控件微软定义了一系列的控件专门用于显示数据的格式，通过这些控件可以可视化的方式查看绑定数据之后的效果。
这些控件称之为数据绑定控件。
在中，所有的数据库绑定控件都是从BaseDataBoundControl这个抽象类派生的，这个抽象类定义了几个重要属性和一个重要方法：●DataSource属性指定数据绑定控件的数据来源，显示的时候程序将会从这个数据源中获取数据并显示。
●DataSourceID属性指定数据绑定控件的数据源控件的ID，显示的时候程序将会根据这个ID找到相应的数据源控件，并利用这个数据源控件中指定方法获取数据并显示。
●DataBind ()方法当指定了数据绑定控件的DataSource属性或者DataSourceID属性之后，再调用DataBind()方法显示绑定的数据。
在使用数据源时，先尝试使用DataSourceID属性标识的数据源，如果没有设置DataSourceID时才会用到DataSource属性标识的数据源。
也就是说DataSource和DataSourceID两个属性不能同时使用。
在中，主要包含5个数据源控件，如GridView、DataList、Repeator、DetailsView、FormView。
其中，前3个控件用于呈现多列数据，而后面2个控件用于呈现单列数据。
●GridView控件GridView 控件以表的形式显示数据，并提供对列进行排序、分页、翻阅数据以及编辑或删除单个记录的功能。
GridView 控件是 的早期版本中提供的DataGrid 控件的后继控件。
除了添加利用数据源控件功能的新功能，GridView 控件还实现了某些改进。
●DetailsView控件DetailsView控件一次呈现一条表格形式的记录，并提供翻阅多条记录以及插入、更新和删除记录的功能。
DetailsView 控件通常用在主/详细信息方案中，在这种方案中，主控件（如GridView 控件）中的所选记录决定了DetailsView 控件显示的记录。
4.0 创建用户控件在Visual Studio 2010中创建用户控件，就像创建Web页面中创建控件一样，其操作方法比较简单，并且一旦创建成功之后，就可以在多个页面中重复使用。
1．创建用户控件文件首先，在已经创建好的Web项目中，右击目录结构，并执行【添加】|【新建项】命令，如图8-1所示。
图8-1 添加Web项然后，在弹出的【添加新项】窗口中，选择左侧列表栏中的【Visual C#项】选项，并在中间的列表栏中，选择【用户控件】选项，如图8-2所示。
图8-2 选择用户控件最后，在【名称】文本框中，更改用户控件的名称，如更改为Userlogin.cs ，并单击【添加】按钮。
2．用户控件添加内容当用户创建用户控件之后，会生成一个.ascx 文件。
而.ascx 页面结构与.aspx 页面基本相同。
用户可以在【解决方案管理器】中可以展开.aspx 文件和.ascx 文件进行对比，其结构并没有太大的变化，如图8-3所示。
图8-3 用户控件结构用户控件中并没有“<html><body>”等标记，因为.ascx 页面作为控件被引用到其他页面，引用的页面（如.aspx 页面）其中已经包含<body><html>等标记。
如果用 当用户在【添加新项】的中间栏中，选择某个选项时，则在右侧栏中显示该选项的相关介绍。
户控件中使用这样的标记，可能会造成页面布局混乱。
在【解决方案资源管理器】中，双击.ascx文件，并在【工作区】中显示该文件。
然后，在【设计】模式中，可以添加Label、TextBox和Button等控件，并设计用户登录内容，如图8-4所示。
图8-4 设计用户登录界面在该文件的第一行代码中，使用了@Control指令。
而该指令在前面的章节中已经提到过。
该指令与@Page指令基本相似，在.aspx文件中包含了@Page指令，而在.ascx文件中则不包含@Page指令，该文件中包含@Control指令。
4.0 自定义数据库连接控件通过自定义控件，用户可以将自己设计的用户界面和其他功能都封装起来到可复用的包中，并编译成服务器端控件。
下面通过定义一个数据库连接控件，即将连接数据库的功能封闭到一个控件中，用户在连接数据库或者对数据库进行操作时，只需在定义数据库连接类型，以及进行操作SQL语句即可。
（1）执行【文件】|【新建项目】命令，并在弹出的【新建项目】对话框中，选择Web模板。
然后，再选择【 服务器控件】选项，并修改【名称】为DbMp，单击【确定】按钮，如图8-1所示。
图8-1 创建服务器控件（2）在【解决方案资源管理器】中，右击【ServerControl1.cs】目录选项，并修改为【DbMp.cs】名称，如图图8-2所示。
图8-2 修改控件的文件名（3）双击DbMp.cs文件，并在编辑器中编写进行数据库连接的代码。
详细代码如下：（4）执行【生成】|【生成DbMp】命令，并将该控件生成控件，如图8-3所示。
图8-3 生成控件（5）创建Todbdata Web项目，并添加Default.aspx窗体页，如图8-4所示。
图8-4 创建Web项目（6）右击目录选项，并执行【添加引用】命令，如图8-5所示。
然后，在弹出的【添加引用】对话框中，选择【浏览】选项，并选择已经创建的DbMp.dll控件，如图8-6所示。
图8-5 添加引用图8-6 选择自定义控件（7）双击【Default.aspx.cs】代码文件，并在编辑器中添加连接数据，以及显（8）单击【启动调试】按钮，即可浏览数据库中的信息，如图8-7所示。
在该网页中，所有显示数据，通过代码文件来实现的。
图8-7 显示数据库内容。
4.0 简单的日历控件在网页中，用户可以在页头部位插入一个日历控件，方便访问者随时了解当前日期信息。
并且有些网页中，除了插入日历内容外，还包含有天气信息等等。
（1）在窗口中，执行【文件】|【新建】|【项目】命令。
在弹出的【新建项目】对话框中，选择Web模板，并在中间栏中选择【 空Web应用程序】选项。
然后，再修改【名称】为show_date，单击【确定】按钮，如图8-25所示。
图8-25 创建项目（2）在【解决方案资源管理器】中，右击站点目录，并执行【添加新项】命令。
在弹出的【添加新项】对话框中，选择【Visual C#】模板，并选择【Web窗体】选项，单击【添加】按钮，如图8-26所示。
图8-26 添加窗体页（3）再在【解决方案资源管理器】中，右击站点目录，并执行【添加新项】命令。
在弹出的【添加新项】对话框中，选择【Visual C#】模板，并选择【Web用户控件】选项。
然后，将【名称】修改为date，并单击【添加】按钮，如图8-27所示。
图8-27 添加用户控件（4）展开date.ascx文件，并双击date.ascx.cs文件，在编辑器中编写获取日期、农历日期、星期等信息。
详细代码如下：（5）再双击date.ascx文件，并在编辑器中，编写如下代码。
该文件用于显示日历内容。
而由于用户不能直接访问该文件，所以必须通过加载到窗体页中查看效果。
（6）双击Default.aspx文件，并在该文件中，加载所设计的用户按钮，来查看（7）单击【启动调试】按钮，即可浏览窗体页中所加载的控件效果，如图8-28所示。
用户还可以在该控件中，添加时间、天气信息等内容。
这样，这个控件就可以直接应该到不同网页中。
图8-28 显示控件。
4.0 管理菜单和工具栏在Visual Studio2010中，用户可以对Visual Studio的开发环境进行设置，以符合自身学习和工作的需要。
用户不仅可以对软件中的菜单和工具栏进行设置和修改，还可以自行添加新的菜单、工具及其他功能，本练习就将对其开发环境进行设置。
Visual Studio界面中的菜单和工具栏不是固定不变的，用户可以根据自身的需求对菜单和工具栏进行管理，如：为菜单和工具栏添加或删除命令、添加新菜单等。
（1）在Visual Studio2010中执行【工具】|【自定义】命令，弹出【自定义】对话框，如图1-1所示。
图1-1 【自定义】对话框（2）在【自定义】对话框中，选择【命令】选项卡。
选择【菜单栏】单选按钮，并在【菜单】选项卡中选择“菜单栏”，如图1-2所示。
图1-2 【命令】选项卡（3）然后，单击【添加命令】按钮，为所选菜单添加命令。
并在弹出的【添加命令】对话框中，选择需要添加的命令，单击【确定】按钮即可完成命令的添加，如图1-3所示。
图1-3 添加命令（4）返回【命令】选项卡，单击【添加新菜单】按钮，【控件】列表框中就会显示名为【新菜单】的菜单。
然后，再单击【修改所选内容】按钮，在【名称】文本框中为新添加的菜单设置名称，如图1-4所示。
图1-4 添加新菜单（5）在【控件】列表框中，选择某一菜单或工具后，还可以单击【上移】或【下移】按钮对菜单或工具栏的顺序进行调整，如图1-5所示。
图1-5 调整菜单或工具栏顺序（6）选择【工具栏】选项卡，单击【新建】按钮，在弹出的【新建工具栏】对话框中输入工具栏名称，添加新工具栏，如图1-6所示。
图1-6 新建工具栏（7）然后，选择名为【自定义1】的工具栏，单击【修改所选内容】按钮，设置所选工具栏的名称或停靠位置，如图1-7所示。
图1-7 修改工具栏。
4.0 添加ListView控件添加ListView 控件与添加GridView控件和DataList控件的方法，非常相似。
而只不过该控件与可GridView控件和DataList控件，在显示上有一定的区别。
ListView 控件使用4种不同视图显示项目，如可将项目组成带有或不带有列标头的列，并显示伴随的图标和文本。
（1）创建站点，并在Default.aspx文件的【设计】视图中，添加ListView 控件。
例如，选择工具箱中的【数据】组中的ListView控件，并拖至<body>标签中，如图10-29所示。
图10-29 添加控件（2）在【ListView任务】框中，选择【选择数据源】列表中【<新建数据源…>】选项，如图10-30所示。
图10-30 新建数据源（3）在弹出的【选择数据源类型】中，选择SQL数据库，并自动产生数据源指定的ID，单击【确定】按钮，如图10-31所示。
图10-31 添加数据源（4）在弹出的【选择您的数据连接】对话框中，在列表中选择已经连接好的数据源，单击【下一步】按钮，如图10-32所示。
图10-32 选择数据源（5）在【配置Select语句】对话框中，选择“指定来自表或视图的列”选项，并选择星号（*），单击【下一步】按钮，如图10-33所示。
图10-33 选择字段列（6）在弹出的【测试查询】对话框中，单击【测试查询】按钮即可显示数据内容，单击【完成】按钮，如图10-34所示。
图10-34 显示查询数据（7）在【ListView任务】框中，单击【配置ListView】链接，如图10-35所示。
图10-35 配置ListView控件（8）在【配置ListView】对话框中，选择【样式】为“蓝调”，并启用【启用分页】复选框，单击【确定】按钮，如图10-36所示。
图10-36 配置ListView控件（9）此时，ListView控件，将显示数据源中的内容，并显示分页按钮等，如图10-37所示。
4.0 创建调查小模块用户控件
在前面的内容中，已经介绍过如何创建用户控件，并向窗体页中添加用户控件。
而该实例，还来围绕用户控件的应用，编写一个用于在窗体页中进行调查的小模块的制作。
（1）创建一个line_count站点，并在该站点，右击站点的目录，执行【添加新项】命令。
然后，在弹出的【添加新项】窗口中，选择【Visual C#】选项，并在中间栏中选择【Web用户控件】选项，单击【添加】按钮，如图8-23所示。
图8-23 添加用户控件
（2）在创建的WebUserControl.ascx文件中，编写用于调查的内容项，其详细
（3）双击Default.aspx文件，并在该文件中添加已经创建的用户控件文件。
下
（4）单击工具栏中的【启动调试】按钮或者按F5键，并弹出IE浏览器窗口，显示所插入的用户控件内容，如图8-24所示。
图8-24 显示用户控件。
4.0 通过代码添加控件
GridView类是所有GridView控件的抽象，其可以用于创建GridView控件，也可以通过该类的字段和属性对GridView控件进行预定义，或通过该类的方法对控件进行操作。
之前介绍的使用代码创建GridView控件，事实上就是实例化了一个GridView类的对象。
1．在窗体页中添加代码
先在窗体中，添加GridView控件。
然后，在控件中，添加数据表字段内容。
同
2．构造GridView对象
双击Default.aspx.cs文件，并在代码中构造一个GridView控件对象，使用
3．添加GridView事件
用户除了在代码文件中，添加GridView控件对象以外，还可以添加一些对数据进行的操作事件。
例如，编辑数据、删除数据、选择数据记录等，正如在Default.aspx 窗体页中所添加的一些操作内容。
下面来看一下，Default.aspx.cs代码文件中，所有代码内容，并了解窗体页与代
通过GridView控件添加数据内容，可以在窗体页中显示数据表内容。
并且，用户还可以操作窗体页中的表格内容，以达到修改数据库中数据信息。
例如，单击工具栏中的【启动调试】按钮，即可在IE浏览器中显示数据库中数据表的数据信息，如图10-17所示。
图10-17 显示数据表内容
然后，用户可以单击第一条记录后面的【删除】链接，并弹出的“确定要删除吗？”信息，并单击【确定】按钮。
删除成功后，将提示“删除成功！”信息，否则提示“删除失败！”信息，如图10-18所示。
图10-18 删除记录。
