为 SharePoint 创建联系表单 Web 部件

• 下载源代码 - 5.93 KB

引言

SharePoint 是一款功能强大的应用程序，可帮助组织快速实现基于 Web 的门户，用于管理和共享群组信息。开箱即用，它提供了许多组件，如文档库和可配置列表。对于更高级的需求，SharePoint 提供了创建 Web 部件的功能，Web 部件是可以插入 SharePoint 网站并与之交互的自定义组件。Web 部件是一种简单而强大的方式，可以扩展 SharePoint 的功能以满足您组织的独特需求。

本文将分步演示如何创建一个简单的 SharePoint Web 部件，该部件实现一个联系表单。联系表单通常用于公共网站，为客户、业务合作伙伴和公司外部人员提供一种方式，通过填写网页上的字段并点击“提交”按钮来提交问题或请求信息。当用户点击“提交”时，此 Web 部件将收集用户的姓名、电子邮件地址、电话号码和消息，并将信息发送到指定的电子邮件地址。

要求

本文中创建的 Web 部件将使用 Windows SharePoint Services (WSS) 3.0。它也将兼容 MOSS 2007，后者是 SharePoint 的更高级版本，构建在与 WSS 3.0 相同的架构之上。为了创建 Web 部件，我们将使用安装在 Windows Server 2003 上的 Visual Studio 2008，以及 Windows SharePoint Services 3.0 工具：Visual Studio 2008 扩展，版本 1.2，可从 Microsoft 下载中心免费下载。

创建 Web 部件项目

第一步是使用 Visual Studio 2008 创建一个新的 Web 部件项目。为此，请打开 Visual Studio 2008，然后从文件菜单中选择“新建”–“项目”。从“项目类型”列表中选择“Visual C# - SharePoint”，然后从右侧列表中选择“Web 部件”模板。输入 ContactFormWebPart 作为名称和解决方案名称，然后选择要保存解决方案文件的目录。点击“确定”后，一个空的 Web 部件项目将在 Visual Studio 中创建并打开。

空项目带有一个名为 WebPart1 的 Web 部件，但这不是我们想要称呼 Web 部件的名称，所以第一步是通过在 Visual Studio 的解决方案资源管理器中右键单击 WebPart1 文件夹并选择“删除”来从项目中删除 WebPart1。

接下来，让我们向项目添加一个名为 ContactForm 的新 Web 部件。在解决方案资源管理器中右键单击 ContactFormWebPart 项目，然后从上下文菜单中选择“添加”–“新项”。从类别列表中选择“SharePoint”，从模板列表中选择“Web 部件”。输入 ContactForm 作为名称，然后点击“添加”。

这将为您提供一个名为 ContactForm.cs 的新源文件，其中包含一个继承自 WebPart 的空类，并带有一些 TODO 注释。在下一节中，我们将替换 CreateChildControls() 函数并向此类添加一些额外的代码。

添加代码以创建控件

现在，我们准备开始编写显示 Web 部件的代码。打开 ContactForm.cs，您将看到一个名为 CreateChildControls() 的函数。我们将在该函数中添加标签、文本框和按钮，以允许用户与我们的 Web 部件进行交互。

但首先，让我们为将要创建的控件创建一些类级别变量。在类级别声明它们而不是在 CreateChildControls() 函数中声明，将允许我们稍后从按钮事件处理程序中引用这些控件。

TextBox txtContactName;
TextBox txtEmailAddress;
TextBox txtPhone;
TextBox txtMessage;
Button btnSendMessage;
Label lblMessageSent;

现在，让我们向 CreateChildControls 添加代码以构建显示。为了保持简单，将使用 HTML 表格以一致的方式对齐控件。每个表格行将有两列：一列用于字段标签，另一列用于文本框。控件逐个创建并添加到表格单元格中，然后添加到表格行中。

protected override void CreateChildControls()
{
    base.CreateChildControls();

    Table t;
    TableRow tr;
    TableCell tc;
    
    // A table that is used to layout the controls
    t = new Table();

    // Label with instructions for the user
    tr = new TableRow();
    tc = new TableCell();
    tc.ColumnSpan = 2;
    tc.VerticalAlign = VerticalAlign.Top;
    Label lblInstructions = new Label();
    lblInstructions.Text = "Please enter your contact" + 
                           " information and message below.";
    tc.Controls.Add(lblInstructions);
    tr.Controls.Add(tc);

    t.Controls.Add(tr);

    // Contact Name label
    tr = new TableRow();
    tc = new TableCell();
    tc.Style["padding-top"] = "7px";
    tc.VerticalAlign = VerticalAlign.Top;
    Label lblContactName = new Label();
    lblContactName.Text = "Name:";
    tc.Controls.Add(lblContactName);
    tr.Controls.Add(tc);

    // Contact Name textbox
    tc = new TableCell();
    tc.VerticalAlign = VerticalAlign.Top;
    txtContactName = new TextBox();
    txtContactName.ID = "txtContactName";
    txtContactName.Width = Unit.Pixel(300);
    tc.Controls.Add(txtContactName);
    tr.Controls.Add(tc);

    t.Controls.Add(tr);

    // Email Address label
    tr = new TableRow();
    tc = new TableCell();
    tc.Style["padding-top"] = "7px";
    tc.VerticalAlign = VerticalAlign.Top;
    Label lblEmailAddress = new Label();
    lblEmailAddress.Text = "Email Address:";
    tc.Controls.Add(lblEmailAddress);
    tr.Controls.Add(tc);

    // Email Address textbox
    tc = new TableCell();
    tc.VerticalAlign = VerticalAlign.Top;
    txtEmailAddress = new TextBox();
    txtEmailAddress.ID = "txtEmailAddress";
    txtEmailAddress.Width = Unit.Pixel(300);
    tc.Controls.Add(txtEmailAddress);
    tr.Controls.Add(tc);

    t.Controls.Add(tr);
    
    // Phone Number label
    tr = new TableRow();
    tc = new TableCell();
    tc.Style["padding-top"] = "7px";
    tc.VerticalAlign = VerticalAlign.Top;
    Label lblPhone = new Label();
    lblPhone.Text = "Phone Number:";
    tc.Controls.Add(lblPhone);
    tr.Controls.Add(tc);

    // Phone Number textbox
    tc = new TableCell();
    tc.VerticalAlign = VerticalAlign.Top;
    txtPhone = new TextBox();
    txtPhone.ID = "txtPhone";
    txtPhone.Width = Unit.Pixel(300);
    tc.Controls.Add(txtPhone);
    tr.Controls.Add(tc);

    t.Controls.Add(tr);
    
    // Message label
    tr = new TableRow();
    tc = new TableCell();
    tc.Style["padding-top"] = "7px";
    tc.VerticalAlign = VerticalAlign.Top;
    Label lblMessage = new Label();
    lblMessage.Text = "Message:";
    tc.Controls.Add(lblMessage);
    tr.Controls.Add(tc);

    // Message textbox
    tc = new TableCell();
    tc.VerticalAlign = VerticalAlign.Top;
    txtMessage = new TextBox();
    txtMessage.ID = "txtMessage";
    txtMessage.Height = Unit.Pixel(100);
    txtMessage.Width = Unit.Pixel(400);
    txtMessage.TextMode = TextBoxMode.MultiLine;
    txtMessage.Wrap = true;
    tc.Controls.Add(txtMessage);
    tr.Controls.Add(tc);

    t.Controls.Add(tr);
    
    // Empty table cell
    tr = new TableRow();
    tc = new TableCell();
    tr.Controls.Add(tc);    

    // Label for telling the user the message was sent
    tc = new TableCell();
    tc.VerticalAlign = VerticalAlign.Top;
    lblMessageSent = new Label();
    lblMessageSent.Text = "Your message has been sent. Thank you.";
    lblMessageSent.Font.Bold = true;
    lblMessageSent.Visible = false;
    tc.Controls.Add(lblMessageSent);
    tr.Controls.Add(tc);

    t.Controls.Add(tr);

    // Empty table cell
    tr = new TableRow();
    tc = new TableCell();
    tr.Controls.Add(tc);

    // Send Message button
    tc = new TableCell();
    btnSendMessage = new Button();
    btnSendMessage.Text = "Send Message";
    btnSendMessage.Click += new EventHandler(btnSendMessage_Click);
    tc.Controls.Add(btnSendMessage);
    tr.Controls.Add(tc);

    t.Controls.Add(tr);

    this.Controls.Add(t);
}

最后，当用户点击“发送消息”按钮时，我们需要添加一个事件处理程序来将消息作为电子邮件发送。在上面的代码中，事件处理程序已经通过代码行 btnSendMessage.Click += new EventHandler btnSendMessage_Click); 连接起来，所以现在我们只需要创建 btnSendMessage_Click 函数。这个函数简单地使用文本框中输入的内容构建一封电子邮件，并使用 SharePoint 的 SPUtility.SendEmail() 函数发送电子邮件。

您需要根据具体情况更改消息头中的“收件人”和“发件人”字段。“收件人”字段指定电子邮件将发送到哪里，“发件人”字段是电子邮件应该看起来像是从哪个电子邮件地址发送的。“发件人”字段并不是太重要，但有些邮件服务器可能要求这是一个有效的电子邮件地址。

protected void btnSendMessage_Click(object sender, EventArgs e)
{
    // Build the email subject string
    System.Text.StringBuilder subject = new System.Text.StringBuilder();
    subject.Append("Contact Form Message from ");
    subject.Append(txtContactName.Text);

    // Build the email message string
    System.Text.StringBuilder message = new System.Text.StringBuilder();
    message.Append("Contact Name: ");
    message.AppendLine(txtContactName.Text);
    message.Append("Email Address: ");
    message.AppendLine(txtEmailAddress.Text);
    message.Append("Phone: ");
    message.AppendLine(txtPhone.Text);
    message.AppendLine();
    message.AppendLine("Message:");
    message.AppendLine(txtMessage.Text);

    // Construct the message header
    System.Collections.Specialized.StringDictionary messageHeader = 
    new System.Collections.Specialized.StringDictionary();
    // TODO: Where to send the email
    messageHeader.Add("to", "CustomerService@example.com");
    // TODO: Who the email should be "from"
    messageHeader.Add("from", "ContactForm@example.com");
    messageHeader.Add("subject", subject.ToString());
    messageHeader.Add("content-type", "text/plain");

    // Send the email
    Microsoft.SharePoint.Utilities.SPUtility.SendEmail(
    SPContext.Current.Web, messageHeader, message.ToString());

    // Let the user know the message was sent
    lblMessageSent.Visible = true;

    // Clear out the input fields
    txtContactName.Text = "";
    txtEmailAddress.Text = "";
    txtPhone.Text = "";
    txtMessage.Text = "";
}

测试 Web 部件

现在，我们准备测试 Web 部件。最简单的方法是在 Visual Studio 2008 的“生成”菜单中选择“部署解决方案”。成功生成并部署后，打开 Web 浏览器并导航到 SharePoint 网站。从“网站操作”菜单中，选择“编辑页面”。这将使页面进入“编辑模式”，在此模式下可以添加、删除和配置 Web 部件。

出于测试目的，我们不关心 Web 部件的确切位置，因此只需单击主左侧区域中的“添加 Web 部件”。这将打开一个对话框，列出此 SharePoint 服务器上所有可用的 Web 部件。如果您向下滚动列表，应该会看到 ContactForm Web 部件。在此 Web 部件旁边打勾，然后单击“添加”按钮。

您现在应该在页面上看到联系表单。在仍处于编辑模式时，您可以更改其他设置，例如显示在 Web 部件上方的标题，或高度和宽度。为了测试，我们将所有内容保留为默认值，因此只需单击“退出编辑模式”按钮。页面现在将显示联系表单，我们已准备好进行测试。输入姓名、电子邮件地址、电话号码和消息，然后单击“发送消息”。如果一切成功，您将看到一条消息，说明您的消息已发送，并且在几分钟内，您将收到由 btnSendMessage_Click() 生成的电子邮件。

检查出站电子邮件设置

如果您在点击“发送消息”时收到错误消息，或者电子邮件在 5 到 10 分钟内未送达，则可能是因为 SharePoint 中未配置出站电子邮件设置。这可以由 SharePoint 管理员使用中央管理网站完成。在中央管理中，转到“操作”选项卡，然后选择“出站电子邮件设置”。确保“出站 SMTP 服务器”已配置邮件服务器名称。

部署 Web 部件

测试完 Web 部件后，即可将其作为解决方案部署到生产 SharePoint 服务器。为此，我们将创建一个 SharePoint 解决方案包，它是一个扩展名为 .wsp 的 .cab 文件。当您从 Visual Studio 中选择“部署”时，会自动创建 .wsp 文件。将 Visual Studio 中的活动配置从“调试”更改为“发布”，然后从“生成”菜单中选择“部署解决方案”。

成功将发布版本部署到本地 SharePoint 服务器后，您的项目目录的 /bin/Release 子文件夹中将有一个名为 ContactFormWebPart.wsp 的文件。将此文件复制到生产 SharePoint Web 服务器上的文件夹，或可以从该服务器访问的位置。然后，在生产 SharePoint Web 服务器上的命令提示符下运行以下命令。这些命令将把解决方案添加到 SharePoint，然后部署解决方案，使其可供所有网站使用。

C:\>stsadm -o addsolution -filename ContactFormWebPart.wsp

C:\>stsadm -o deploysolution -name ContactFormWebPart.wsp -immediate 
           -allowgacdeployment -allcontenturls

现在，该 Web 部件已可用于生产 SharePoint 服务器。只剩下一件事要做了。当您想在 SharePoint 网站中使用它时，您需要将其添加到该网站的 Web 部件库中。为此，请导航到您的 SharePoint 网站并转到“网站操作” - “网站设置”。然后，点击“库”部分下的“Web 部件”链接。这将打开一个网页，列出当前可用于此网站的 Web 部件。点击“新建”将新的 Web 部件添加到列表中。下一个网页显示已部署的 Web 部件。勾选 ContactFormWebPart.ContactForm 旁边的框，然后点击“填充库”按钮。

您现在应该在网站库的 Web 部件列表中看到联系表单 Web 部件。一旦 Web 部件进入库，您就可以编辑网站中的页面，并将 Web 部件添加到页面中，就像我们在测试时所做的那样。

额外改进

我们创建的联系表单 Web 部件可以进行一些改进，但这些超出了本文的范围。以下是一些改进联系表单 Web 部件的想法：

首先，我们可以为字段添加验证，以确保必填字段已填写且输入的数据与预期格式匹配。例如，联系人姓名应为必填项，消息应为必填项，电子邮件地址应符合典型的电子邮件地址格式，电话号码应为有效电话号码的格式。

其次，我们可以为 Web 部件添加属性，以允许自定义标签文本以及用于发送电子邮件的收件人地址和发件人地址。这些属性将允许在 SharePoint 中编辑页面时更改 Web 部件的外观，而不是要求在源代码中进行这些更改。

其他开发环境选项

Web 部件可以使用 Visual Studio 2005 创建，但 Visual Studio 2008 与 WSS 3.0 可下载扩展一起使用，可以更轻松地打包和部署您的 Web 部件。如果可能，我强烈建议使用 Visual Studio 2008 进行 Web 部件开发。

为了使用适用于 Visual Studio 2008 的 WSS 扩展，开发环境需要在 SharePoint 服务器上运行。但是，许多开发人员使用客户端操作系统进行开发，而不是 SharePoint 所需的服务器操作系统。这时 Microsoft Virtual PC 会非常有帮助。Virtual PC 将允许您在开发 PC 上虚拟运行另一个计算机实例，这样您就可以为 SharePoint Web 部件开发环境创建一个 Virtual PC 映像。

如果您是 Web 部件开发的新手，并且想在不设置完整 SharePoint 环境的情况下尝试一下，Microsoft 提供了一个 Windows SharePoint Services 3.0 SP1 开发人员评估 VPC 映像，其中已安装 WSS 3.0、Visual Studio 和扩展。您可以将其与 Virtual PC 结合使用，以获得一个“即时”SharePoint 环境。

结论

在本文中，您学习了如何为 SharePoint 创建一个简单的 Web 部件，该部件实现了一个联系表单，用于收集信息并将其作为电子邮件发送给收件人。Web 部件还有许多其他用途，包括与 SharePoint 中的其他 Web 部件通信，以及与外部数据库和应用程序集成。SharePoint 使用自定义 Web 部件的能力是一项强大的功能，可用于将 SharePoint 的功能扩展到基本自定义所能达到的范围之外。

修订历史

• 2008/12/08 - 初始版本。