Emancipate yourself from mental slavery; none but ourselves can free our minds. – Nesta

Hopefully, all of you have read and implemented my guide to installing a SharePoint development environment for free.  If not, you can find the link here:  http://www.themackpage.com/2009/05/26/how-to-build-your-totally-free-sharepoint-development-environment/

If you are lucky enough to have a development environment with even better tools, as I am sure most of you do, then please feel free to use whatever best tools you have as you make your way through this. 

Also, there is a supporting screencast for this blog post that contains much more detailed information.  You can find it here:  http://www.themackpage.com/screencasts/dynamic-pageviewer-web-part

Without further ado, let’s get down to it.  Here are the steps to create your very own dynamic PaveViewer web part.

  • Since we are going to be deploying this into the bin folder for one or more SharePoint web applications, instead of to the GAC, we need to allow partially trusted callers.
    • Go into AssemblyInfo.cs (it’s in the Properties folder)
    • Add the following statement at the top of the code:  
       
      using System.Security;
    • Add the following code at the bottom of the file:
       
      // Allow partially trusted callers
      [assembly: AllowPartiallyTrustedCallers]
    • Save AssemblyInfo.cs
  • Add references to System.Web and the SharePoint DLL to your project
    • Right-click the References folder and select Add Reference
    • Select System.Web under the .NET tab
    • Select Windows SharePoint Services under the .NET tab
  • Ensure that your list of using statements at the top of your class file looks like this:   
     
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.UI.WebControls.WebParts;
    using Microsoft.SharePoint;
    using Microsoft.SharePoint.WebControls;
    using Microsoft.SharePoint.WebPartPages;
    using System.ComponentModel;
    using System.Collections.Specialized;
     
  • Make sure that your class implements the SHAREPOINT (as in, NOT to System.Web) version of the WebPart class, like so: 
     
    public class QSPVWP : Microsoft.SharePoint.WebPartPages.WebPart
  • Next, we will add the code for a custom attribute that users will be able to set in the Web Part’s Tool Pane.  Let’s call it something like “Base URL”.  Here is the code to do that:  
     
    //Set custom attribute to allow user to specify Base URL in Tool Pane
    private string _baseURL = "";
    [WebBrowsable(true),
    Personalizable(PersonalizationScope.Shared),
    Category("Base URL Settings"),
    WebDisplayName("Base URL"),
    WebDescription("Supply the Base URL for the page viewer query string web part.")]
     
    public string baseURL
    {
        get
        {
            return this._baseURL;
        }
        set
        {
            this._baseURL = value;
        }
    }
     
  • The next step is to override the RenderWebPart method.  Intellisense should help you out here.  Once you have the method shelled out, delete the base.RenderWebPart(); line that came with the original method. 
  • Add in a couple of variable definitions like so: 
     
    NameValueCollection queryString = Page.Request.QueryString;
    string URL = this.baseURL;
    int paramCount = 0;
     
  • Next, we are going to loop through the collection of QueryString parameters in the web part’s page, and add them to the Base URL.  Here is the code for this step: 
     
    if (queryString.Count > 0)
    {
        // Set up URL as having a Query String
        URL += "?";
     
        // Loop through QueryString collection and add all name/value pairs to 'URL'
        foreach (string qsName in queryString)
        {
            // Add name/value pair for current key to the URL
            URL += qsName + "=" + queryString[qsName];
     
            // Add ampersand for all but the last query string parameter
            paramCount++;
            if (paramCount < queryString.Count)
                URL += "&";
        }
    }
     
  • Now that we have concatenated all that stuff to make our URL, which includes the QueryString parameters from the web part page, we need to actually use it to display the URL in the web part.  I figured out how to do this by putting a standard PageViewer Web Part on the page and then viewing the source.  There are several attributes you may or may not care about setting, but the Src attribute is the important one.  Here is the code to tell the web part’s IFRAME to serve up the URL: 
     
    string name = "QueryStringPageViewer_" + this.UniqueID;
    output.AddAttribute(HtmlTextWriterAttribute.Id, name, false);
    output.AddAttribute(HtmlTextWriterAttribute.Name, name, false);
    output.AddAttribute(HtmlTextWriterAttribute.Width, "100%", false);
    output.AddAttribute(HtmlTextWriterAttribute.Height, "100%", false);
    output.AddAttribute(HtmlTextWriterAttribute.Src, URL, false);
    output.AddAttribute("ddf_src", URL, false);
    output.AddAttribute("frameBorder", "0", false);
    output.RenderBeginTag(HtmlTextWriterTag.Iframe);
    output.RenderBeginTag(HtmlTextWriterTag.Div);
    output.Write("IFrames not supported by this browser");
    output.RenderEndTag(); //Div
    output.RenderEndTag(); //Iframe
     
  • You should now be done coding!
  • The next step is to strongly name our assembly.
    • Right-click the project name and select Properties
    • Select the Signing tab
    • Check the box for Sign the assembly
    • In the dropdown, select <New>
    • Name your strong name key something like <AssemblyName>.snk (substituting the actual name of your assembly, of course)
    • Uncheck the password box
    • Click OK
  • Build the project and copy the DLL from your project’s bin folder to the bin folder of a SharePoint web application.  These are probably located somewhere like:  C:\Inetpub\wwwroot\wss\VirtualDirectories\intranet.company.com80\bin
  • Now, we need to edit the web.config file for our web application.  It should be located at a location that looks something like this:  C:\Inetpub\wwwroot\wss\VirtualDirectories\intranet.company.com80
    • Open web.config in your preferred editor
    • Look for the trust element and make sure that it is not using WSS_Minimal.  If so, change it like so: 
       
      <trust level="WSS_Medium" originUrl="" />
       
    • Add the new web part to the list of Safe Controls in the config file.  To do this, you will need the Assembly Name, Version, Culture, Public Key Token, NameSpace and Class/Type Name.  The easiest way to get this (and a whole bunch of other stuff) is to use Reflector.  It’s free and you can get it here:  http://www.red-gate.com/products/reflector/.  For a VERY brief tutorial on how to use it to get the information you need, check out the supporting screencast for this blog post here:  http://www.themackpage.com/screencasts/dynamic-pageviewer-web-part.  Hop to the 20-minute mark in the screencast.
    • Save web.config
    • Do an iisreset
  • The next step is to add the Web Part to the Web Part Gallery of your site collection. 
    • From your site collection top-level site, go to the Site Settings
    • In the Galleries column, select Web Parts
    • When you see the list of Web Parts, click the New button
    • The list of Web Parts available is displayed in alphabetical order and they are displayed in the format <AssemblyName>.<ClassName>.  Find your web part and check the box to its left
    • Scroll back up to top of the page and click the Populate Gallery button
    • OPTIONAL, but a GOOD IDEA – click the icon to the right of your web part in the Web Parts Gallery to edit its settings.
      • Give it an intuitive Title – this will be the default name displayed on the title bar of the chrome of your web part
      • Give it a nice Description
      • Use the Specify your own value in the Group section … this will make it much easier to find your web part in the list of available web parts when you are adding it to a page
      • Click the OK button
  • Now, you can add the web part to any Web Part Page in your site collection.

      So, how do you use the Web Part?  Just use the Modify Shared Web Part option and set the Base URL in the Base URL Settings area of the Tool Pane.  Once you have done that, you should be good to go.  Here is a very easy test to see if it is going to work for you.

      • Set the Base URL to the following:  http://www.google.com/search
      • Under Appearance, set the web part to have a fixed height of around 650 pixels
      • Click OK
      • Exit the Edit Mode
      • In another browser tab or window, execute a Google search
      • Grab the query string from the address bar of that tab/window…this is just everything from the “?” to the right…highlight it and Ctrl-C
      • Go back to the web part page and add the query string the the page URL using Ctrl-V
      • Hit Enter.  The page should refresh with the Google search results displayed in the web part.
      • Congratulations!  It’s working!

      That’s about it…pretty simple, huh?

      There is one caveat –> you cannot use a parameter called id (upper or lower case) in your QueryString within SharePoint.  SharePoint will react to it in a decidedly negative way.  If you don’t believe me, go back to your web part page with the Google results displayed in the web part and add the following text at the end of the URL: “&id=420”.  Hit Enter and see what happens.

      Hope you enjoyed it.  Remember, there is even more detail available on the screencast, which you can find here:  http://www.themackpage.com/screencasts/dynamic-pageviewer-web-part

      Also, although I think just about all of the code is supplied above, here is a link to a text file that contains the C# code.  If you have added the System.Web and Windows SharePoint Services references to your project, you should be able to cut and past the entire contents of the text file right into your class file.  You can get the text file here:  http://www.themackpage.com/files/Dynamic-PageViewer-Web-Part.txt

    • Comments

      6 Responses to “Making a Dynamic PageViewer Web Part Using Request.QueryString”

      1. Making a Dynamic PageViewer Web Part Using Request.QueryString Redux : The Mack Page on May 27th, 2009 6:14 pm

        [...] Making a Dynamic PageViewer Web Part Using Request.QueryString [...]

      2. DavidA on June 9th, 2009 5:13 pm

        Awesome! Thank you for posting!

      3. Raghu on August 20th, 2009 10:35 am

        Very good article…. simple n perfect

      4. Hemen on September 23rd, 2009 1:41 pm

        Nice article…works perfectly as per my expectation…

      5. Andre on February 4th, 2010 8:49 am

        I am trying out the code, but it does not work.

        I am able to compile the dll, publish the WebPart into the Gallery and add it to the page.

        There is however no “Base URL Settings” area available.

        On the other hand I have to maintain Filter settings.

        Best regards,
        Andre

      6. Leandro on August 9th, 2010 11:45 am

        It works !, thank a lot !!

      Leave a Reply