
- Microsoft Expression Web 教程
- MS Expression Web - 主页
- MS Expression Web - 概述
- 环境设置
- MS Expression Web - 新网站
- 空白网页
- 网页布局
- MS Expression Web - HTML 布局
- 水平导航
- 垂直导航
- MS Expression Web - 验证页面
- 动态网页模板
- MS Expression Web - 搜索页面
- MS Expression Web - 图像
- MS Expression Web - 超链接
- MS Expression Web - 视频
- SQL数据源
- MS Expression Web - MS Word
- MS Expression Web - Gridview
- MS Expression Web - 母版页
- MS Expression Web - 数据表
- MS Expression Web - 发布
- 备份网站
- MS Expression Web - 插件
- MS Expression 网络资源
- MS Expression Web - 快速指南
- MS Expression Web - 资源
- MS Expression Web - 讨论
Microsoft Expression Web - Gridview
GridView 控件用于在表中显示数据源的值。每列代表一个字段,每行代表一条记录。在本章中,我们将学习一个非常简单的过程,在 GridView 的网页上显示数据库中的数据。
步骤 1 - 让我们在 SQLDataSource 项目中创建一个新的 ASPX 页面并将其命名为gridview.aspx

步骤 2 - 在工具箱中,您将看到 ASP.NET 控件。将 GridView 控件拖放到表单部分上。

您可以看到 GridView 上下文菜单已打开。现在从选择数据源下拉列表中选择<新数据源...> 。它将显示数据源配置向导。
步骤 3 - 选择数据库,因为我们将从 SQL 数据库获取数据并指定数据源 ID。单击“确定”。

步骤 4 - 选择我们在 SQL 数据源章节中创建的现有连接字符串,因为我们将在本章中使用相同的数据库。点击下一步。

步骤 5 - 为了便于理解,让我们选择学生表并单击 *复选框,这将从学生表中检索所有列。点击下一步。

步骤 6 - 在下面的向导中,您可以测试查询,因此让我们单击“测试查询”按钮。

单击“下一步”后,它将显示以下屏幕 -

gridview.aspx的设计视图如下所示 -

步骤 7 - 让我们在浏览器中预览网页。它将显示如下 -

这是一个简单的表格,没有任何格式。
步骤 8 - 您可以从GridView 上下文菜单格式化 GridView 。

单击自动格式...链接。在“自动套用格式”对话框中,有许多预定义的方案。根据您的要求选择一个方案,然后单击“确定”。

让我们再次在浏览器中预览网页。它看起来像下面的屏幕截图。
