kamagra how much to take

Using the Wizard Control In WebParts

The ASP.NET 2.0 WizardControl is pretty awesome, especially if you are building a WebPart that goes through a sequential period of steps while collecting information, either delegating that information to other sources, or aggregating the total data for a computation of some sort. In essence, the WizardControl is a way to build a WebPart that will contain several steps for user interaction by using familiar child controls, such as buttons that leverage the next/previous/final application architecture. I am using it pretty heavily when building form type scenarios when I don’t have the availability of Office Forms Server 2007 since I can accomplish some of the same kind of business optimization through electronic conversion benefits.

As you navigate throughout the net, you will find very little documentation on using the WizardControl outside of how to drag it from the toolbox onto the design surface for a WebForm, which is not particularly useful for control / WebPart developers. Since I had to use the WizardControl recently for my current project, I thought I would save some people the time of researching information and go over how to consume it in a basic WebPart. At the end of this post, you will see how to design the control, wire appropriate control delegates for master step output, as well as how to bind events to the particular buttons to really build a great sequential WebPart. If you are reading this, I am going to assume that you are already familiar with WebPart development, so am not going to go over the WebPart basics, however on the primary sharepointsecurity.com site, here is an article that details how to create a basic SharePoint 2007 WebPart.

First thing is first, and like I said, this post assumes you are familiar with settings up the WebPart class file. If you are targeting your WebPart to consume from the SharePoint WebPart base class, you are going to need a reference in your using statements to System.Web.UI.WebControls since the Wizard class derives from there, so the top of your WebPart class file should have the following references established:

  1. using System.Web.UI.WebControls;

Once you have the references prepared, you must declare that you are going to use a wizard control. Under class, prepare the following for use:

  1. private Wizard _stepwizard;

The assignment that you are making is going to be used throughout the rest of the code file for properties, attributes, and event wiring.

Navigate to your CreateChildControls() method in the WebPart class file, which should only currently have base.CreateChildControls() in it in order to ensure that the appropriate child controls are registered on the page by the WebPart.

  1. protected override void CreateChildControls()
  2. {
  3. base.CreateChildControls();
  4. }

In this method you are going to add the appropriate code to create the Wizard, which can then parse out in the Render method using Control.RenderChildren out of the System.Web.UI namespace which allows the content to be parsed to an HtmlTextWriter object for display on the screen. We will look at this more later, but for a reference it will be something as simple as:

  1. this.EnsureChildControls();
  2. RenderChildren(output);

Back to the Wizard functionality. In the CreateChildControl method where the Wizard is going to be instantiated from, you are going to perform two major tasks, design the overall Wizard, and design the Wizard steps that build up that aggregate Wizard control. The first thing to accomplish is to create the new Wizard object:

  1. protected override void CreateChildControls()
  2. {
  3. base.CreateChildControls();
  4. _stepwizard = new Wizard();
  5. }

Once you have assigned the _stepwizard, you can start to set some of the properties of the Wizard object. There are a lot of style properties, control templates, and misc. attributes that you can set for the parent Wizard control, but for the example I am building here is the relevant code to give you an idea of what you can do. Of course, you should design the control to appropriate assimilate into the design of your SharePoint master pages since the default is pretty plain.

  1. protected override void CreateChildControls()
  2. {
  3. base.CreateChildControls();
  5. // Create the New Wizard
  6. _stepwizard = new Wizard();
  7. // Set some general properties
  8. _stepwizard.Width = Unit.Percentage(100);
  9. _stepwizard.HeaderStyle.BackColor = Color.White;
  10. _stepwizard.HeaderStyle.ForeColor = Color.White;
  11. _stepwizard.HeaderStyle.HorizontalAlign = HorizontalAlign.Center;
  12. _stepwizard.BackColor = Color.WhiteSmoke;
  14. // Sidebar Styles
  15. _stepwizard.SideBarStyle.HorizontalAlign = HorizontalAlign.Left;
  16. _stepwizard.SideBarStyle.VerticalAlign = VerticalAlign.Top;
  17. _stepwizard.SideBarStyle.BackColor = Color.LightGray;
  18. _stepwizard.SideBarStyle.ForeColor = Color.DarkGray;
  19. _stepwizard.SideBarStyle.Font.Underline = true;
  20. _stepwizard.SideBarStyle.BorderColor = Color.Gray;
  21. _stepwizard.SideBarStyle.BorderStyle = BorderStyle.Solid;
  22. _stepwizard.SideBarStyle.BorderWidth = Unit.Pixel(2);
  23. _stepwizard.SideBarStyle.Width = Unit.Pixel(200);
  24. _stepwizard.SideBarStyle.Font.Bold = true;
  25. _stepwizard.SideBarButtonStyle.Font.Bold = true;
  26. _stepwizard.SideBarButtonStyle.ForeColor = Color.DarkSlateGray;
  27. // Set the Button Style Properties
  28. _stepwizard.NavigationButtonStyle.BackColor = Color.LightGray;
  29. _stepwizard.NavigationButtonStyle.BorderColor = Color.Gray;
  30. _stepwizard.NavigationButtonStyle.ForeColor = Color.Gray;
  31. _stepwizard.NavigationButtonStyle.BorderStyle = BorderStyle.Solid;
  32. _stepwizard.SideBarStyle.BorderWidth = Unit.Pixel(2);
  33. // Start Button Properties
  34. _stepwizard.StartNextButtonText = "Next";
  35. _stepwizard.StepNextButtonText = "Next";
  36. _stepwizard.StepPreviousButtonText = "Previous";
  37. // Button Finish Properties
  38. _stepwizard.FinishPreviousButtonText = " Previous";
  39. _stepwizard.FinishCompleteButtonText = "Im Done!";

Now that you have the actual Wizard Control being rendered, it doesn’t make much sense to the user if it doesn’t contain any steps! Therefore, you have to use the WizardStep class in order to make new Wizard steps. There are 5 types of steps that are offered by the Wizard control.

Auto – Wizard controsl how the step is proceeded
Complete – Basically a confirmation page displayed by the wizard
Finish – Contains the finish button, but no next button
Start – No previous button, just the next button
Step – Middle pages in the Wizard, those that have both next and previous

Getting your new steps going is pretty easy, and is really where the rubber hits the road. I am going to make three steps for my Wizard using the below code, named “one”, “two”, and “three”.

  1. WizardStep firstStep = new WizardStep();
  2. firstStep.ID = "One";
  3. firstStep.Title = "One";
  4. firstStep.SetRenderMethodDelegate(RenderOne);
  5. _stepwizard.WizardSteps.Add(firstStep);
  6. WizardStep secondStep = new WizardStep();
  7. secondStep.ID = "Two";
  8. secondStep.Title = "Two";
  9. secondStep.SetRenderMethodDelegate(RenderTwo);
  10. _stepwizard.WizardSteps.Add(secondStep);
  11. WizardStep thirdStep = new WizardStep();
  12. thirdStep.ID = "Three";
  13. thirdStep.Title = "Three";
  14. secondStep.SetRenderMethodDelegate(RenderThree);
  15. _stepwizard.WizardSteps.Add(thirdStep);

Every property for this seems pretty obvious like the ID and the Title stuff. There are a lot of misc. properties that you can set as well. However, there is one thing that is not entirely clear. What the hell is SetRenderMethodDelegate? SetRenderMethodDelegate from the control class is a great way that you can inject your own HTML code that will be called after the control rendering, therefore allows you to code for each specific Wizard step. For example, I have a method call to RenderOne, which in code I could make something as simple as:

  1. protected void RenderOne(System.Web.UI.HtmlTextWriter output, System.Web.UI.Control Container)
  2. {
  3. output.WriteLine("Testing Wizard");
  4. }

which on the first page would render out the text “Testing Wizard”. Each of the steps could therefore have a delgate call to their relevant output method.
Lastly, the Wizard control has to be added by using the add method from the Controls property.

  1. Controls.Add(_stepwizard);

After you have the relevant control display in each Wizard step, you have to wire the relevant events into the Wizard. There are a total of six events that you can override to do whatever type of logic that you desire.

ActiveStepChanged – EventHandler delegate
CancelButtonClick – EventHandler delegate
FinishButtonClick – WizardNavigationEventHandler delegate
NextButtonClick – WizardNavigationEventHandler delegate
PreviousButtonClick – WizardNavigationEventHandler delegate
SideBarButtonClick – requires a WizardNavigationEventHandler delegate

You have to make sure you are using the right delegates for whatever event you are trapping and customizing. For example, the OnActiveStepChanged event requires an EventHandler delegate.

  1. public void OnActiveStepChanged(object sender, EventArgs e)
  2. {
  3. }

Whereas the NextButtonClick event requires a WizardNavigationEventHandler delegate.

  1. public void OnNextButtonClick(object sender, WizardNavigationEventArgs e)
  2. {
  3. }

When you have everything wired, just RenderChildern in your RenderWebPart or RenderContents method and you are ready to go!

This should have you pretty much all the way with getting the Wizard WebPart up and going. If you have any questions, feel free to post them in the comments and I will try my best to answer them.



  1. Mw says:

    Can you give an example of adding a text box to step one and displaying what was entered in the text box on step two?

    I’m not real clear on how to use the RenderOne method stuff and adding a text box to the WizardStep causes an exception.

  2. brad says:

    How do you pull the values from the controls to write back to a sharepoint list?

  3. Mark says:

    Hi Brad,

    I was asking myself the same question up until this morning. The answer is to use the FindControl method of the wizard control. e.g… (please excuse the formatting here, it may not come out very well formatted because I’m cutting and pasting a fair bit)

    protected override void CreateChildControls()

    WizardStep firstStep = new WizardStep();
    firstStep.ID = “One”;
    firstStep.Title = “One”;

    TextBox inputText = new TextBox();
    inputText.ID = “inputText”;

    _stepwizard.FinishButtonClick += this.OnFinishButtonClicked;


    public void OnFinishButtonClicked(object sender, EventArgs e)
    TextBox inputBox = (TextBox)_stepwizard.FindControl(“inputText”);
    String textBoxContents = inputBox.Text;

    // Put processing code here!


  4. Simon says:

    Great article!

    I have an issue with the webpart I have created though.

    It has 4 fields with a calculate button that simply adds them and puts the result in to another textbox. Now, this works quite happily outside of a wizard control, but when it is in one it clears all the fields and adds nothing up?!

    I am using the render method to output my fields. Where am I going wrong?

    My code for the render….

    protected void RenderOne(System.Web.UI.HtmlTextWriter output, System.Web.UI.Control Container)
    //register event handler
    btnAdd.Click += new EventHandler(btnAdd_ClickElec);


  5. Adam Buenz says:

    Try moving it to CreateChildControls, and see if the behavior can be reproduced.

  6. Suman says:


    I already have a sharepoint custom form webpart. So what code should i write to embed those webparts in to wizard step? Can anyone have any clues. Any help soon is much appreciated.

    Suman Paladugu

  7. Sandesh says:

    How to highlight each link/text of the each step when you are on that step…


  1. links for 2007-04-14 » mhinze.com - [...] SharePoint Shelter » Blog Archive » Using the Wizard Control In WebParts (tags: sharepoint) [...]

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>