Tuesday, December 11, 2007

Quick and Dirty Web Parts

SharePoint is a joy for Rapid Application Development and prototyping. It's great fun to sit with clients and run up site hierarchy or document taxonomy on the fly, in response to their direct feedback.

When it comes to any custom development, there is a bit more heavy lifting - especially if there's a requirement for custom web parts. This starts to involve Code Access Security, custom control lifecycles, and change management.

What if you just want to do some RAD custom development?

There are some nifty shortcuts to help with web part prototyping. First of all, the SmartPart and Son of SmartPart are wonderful little controls created by Jan Tielens. They make it easy to create custom user controls with full design support and then make those work in a SharePoint context.

In a similar vein, MOSS includes the very useful Page Viewer Web Part. This is available right out of the box with no assembly required. Follow the steps of this example to use it with very little effort:

1. Create a basic web page, Default.aspx with the following script:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="CustomSharePointWebApp._Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="Field1" runat="server"></asp:TextBox>
        <asp:Button ID="SubmitButton" runat="server" Text="Button" />
        <asp:Label ID="ResultLabel" runat="server" ></asp:Label></div>
        <asp:RequiredFieldValidator ID="Field1RequiredFieldValidator" ControlToValidate="Field1" ErrorMessage="Field 1 cannot be empty" runat="server"></asp:RequiredFieldValidator>
    </form>
</body>
</html>

2. Use the following code for the code-behind:

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

namespace CustomSharePointWebApp
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (Page.IsPostBack)
            {
                ResultLabel.Text = Field1.Text;
            }
        }
    }
}

3. Now right-click the project file in the Solution Explorer and click "Publish". For target location, enter the full path to the _layouts folder as well as the name for your custom app, ie:

http://[Your Sharepoint Portal]/_layouts/[Your web app name]/

This will automatically migrate the code and create a folder in the _layouts directory.

4. Now create a test team site somewhere on your portal. Add a Page Viewer Web Part to the page, and point its link to your application's default.aspx page.

5. You should now see your application appearing in the team site, with full SharePoint context, Master Page, and site hierarchy. Notice that in the example we created, the default.aspx application lifecycle is handled completely outside of SharePoint. By deploying it in the _layouts folder we can lstill everage the SharePoint user context if we need to (for security trimming, user profile information and the like).

Custom Form with Page Viewer

Happy prototyping!

Caution: The Page Viewer Web Part uses iFrames, which present some potential security concerns, such as cross-site scripting attacks. iFrames are probably safest if hosted internally; don't deploy these to public-facing sites unless you've closely examined the security implications!

2 comments:

  1. Nice post. I was looking for a quick way to host aspx pages with managed code to MOSS 2007. This seems to fit the bill.

    ReplyDelete
  2. Thank you so much for this article, it really saved me!

    ReplyDelete

Note: only a member of this blog may post a comment.