Microsoft Expression Web - SQL 数据源


Expression Web 有许多用于处理静态 HTML 页面的工具,但它也有用于创建更多动态页面的工具。动态页面通常从数据源检索数据或内容。在本章中,我们将学习如何创建要在动态页面中使用的 SQL 数据源。

例子

让我们看一个简单的示例,其中我们创建一个下拉列表并通过使用 SQL 数据源从数据库检索数据来填充该列表。

步骤 1 - 首先创建一个新的空网站。

空网站

我们将其称为SQLDataSource。单击“确定”。

步骤 2 - 您将看到 Expression Web 为我们创建了一个文件夹。但是,由于我们选择创建一个空项目,因此我们还没有任何文件。

空项目

Expression Web 不必仅仅用于创建静态 HTML 站点;它还可以用于创建静态 HTML 站点。我们可以轻松地使用页面和控件创建动态站点。

步骤 3 - Expression web 还允许我们创建大量动态内容,而不必成为开发人员。因此,让我们从“文件”→“新建页面”菜单选项添加一个 ASPX 文件。选择中间模型中的 ASPX,然后单击“确定”。

新页面

步骤 4 - 在这里,我们将在表单中创建一个控件,该控件需要访问数据库中的数据以创建动态网站。

在这种特殊情况下,我们将创建一个 SQL 数据源,它将从数据库中检索数据。

SQL数据源

步骤 5 - 转到工具箱并拖动 DropDownList并将其放在代码视图中的<form>标记内,或者您也可以将其放在设计视图中的表单部分中。您将看到该代码是由 Expression Web 添加的。

在这里,我们想要连接数据库中的一些数据并将其存储在下拉列表中。所以,我们首先需要的是数据库。

下拉列表

步骤 6 - 通过转到“新建”→“文件夹”菜单选项,在项目文件夹中创建一个新文件夹。

新建文件夹

步骤 7 - 将此文件夹命名为App_Data

应用程序数据

步骤 8 - 我们需要使用“文件”→“导入”→“文件...”菜单选项在项目中导入数据库。

导入文件

步骤 9 - 它将打开“导入”对话框,如下所示。单击“添加文件...”按钮,这将打开“打开文件”对话框。

导入对话框

步骤 10 - 浏览到您想要包含在网站中的数据库(*.mdf 文件) ,然后单击“打开”。

数据库

步骤 11 - 打开 MyTestDatabase.mdf。它将显示以下对话框。单击“确定”。

我的测试数据库

步骤 12 - 现在您可以看到数据库文件已添加到 App_Data 文件夹中。当您有一个像下拉列表这样的控件并且 Expression Web 允许您将数据绑定到它时,您将在设计视图的右上角看到一个小箭头。

应用程序_数据文件夹

步骤 13 - 这是当前的上下文菜单,可以让我们为该特定控件执行非常具体的任务,其中之一是选择数据源。因此,让我们单击“选择数据源...”,这将打开数据源配置向导。

选择数据源

步骤 14 - 目前,我们没有数据源。让我们从菜单中选择“新数据源”选项。

新数据源

在这里,我们将导入一个 SQL 数据库。让我们选择数据库并单击“确定”。

步骤 15 - 现在,我们需要指定连接字符串。让我们单击“新建连接”按钮。

新连接

步骤 16 - 选择 Microsoft SQL Server 数据库文件并单击“确定”。

微软SQL服务器

步骤 17 - 单击浏览按钮找到数据库文件。

找到数据库

步骤 18 - 选择数据库文件并单击“打开”按钮或双击数据库文件。

数据库文件

步骤 19 - 要测试连接,请单击“测试连接”按钮。

测试连接

它将显示以下屏幕。单击“确定”按钮。

显示屏

步骤 20 - 现在,我们将配置数据源。在以下屏幕上单击“下一步”。

配置数据源

选中该复选框并再次单击“下一步”。

复选框

步骤 21 - 在这里您将看到数据库中的所有表。我们选择Student表。

学生桌

步骤 22 - 您将在列表框中看到所有列。选择IDLastName。在底部,您可以看到它实际上正在创建一个查询。您还可以使用WhereORDER BY 子句。完成查询后,单击“下一步”。

按条款排序

步骤 23 - 单击“测试查询”按钮。它将显示查询结果,如下所示。

查询结果

步骤 24 - 在以下对话框中,默认选择数据源。“选择要在 DropDownList 中显示的数据字段”是实际要显示的字段。让我们选择 LastName,然后从“为 DropDownList 的值选择一个数据字段”中选择 ID,然后单击“确定”。

数据源配置向导

正如您在下面的屏幕截图中看到的,数据源已添加到设计视图中。

添加数据源

以下是 ASPX 文件中的完整代码,该文件由 Expression Web 创建。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<%@ Page Language = "C#" %> 
<html dir = "ltr" xmlns = "http://www.w3.org/1999/xhtml">  
   <head runat = "server"> 
      <meta content = "text/html; charset = utf-8" http-equiv = "Content-Type" /> 
      <title>Untitled 1</title> 
   </head>  

   <body>  
      <form id = "form1" runat = "server"> 
         <asp:DropDownList id = "listID" runat = "server" DataSourceID = "SqlDataSource1"  
            DataTextField = "LastName" DataValueField = "ID"> 
         </asp:DropDownList> 

         <asp:SqlDataSource ID = "SqlDataSource1" runat = "server"   
            ConnectionString = "<%$ ConnectionStrings:MyTestDatabaseConnectionString %>"  
               SelectCommand = "SELECT [ID], [LastName] FROM [Student]"> 
         </asp:SqlDataSource> 
      </form>  
   </body>  
</html>

步骤 25 - 让我们按 Ctrl + S 保存网页。

保存网页

将此页命名为SQLDatasource.aspx并单击“保存”。

步骤 26 - 让我们在浏览器中预览此页面。您将看到一个下拉列表,其中包含学生表中学生的姓氏。

学生姓名