PANVEGA’s Blog

DotNet Development, SharePoint Customizing, Silverlight, MS Infrastructure and other tips and tricks

Create a Multi-Select List Box with InfoPath 2003

Posted by PANVEGA on November 4, 2007

InfoPath 2003 does not include a multi-select list box control, it is possible to create one using the controls present in InfoPath SP1 Preview:

In this post I am going to show you a easy example how to create a very similar approach in 2003 IP than with 2007 IP. This example is from a msdn post.

Like all form design decisions in InfoPath, the first thing you need to do is think about the data you want to collect – how do you want the multiple selections represented in the XML saved or submitted by the InfoPath form?

Additionally, do you want the selections to be determined at form design time (static), or at runtime (dynamic)?

Here’s one approach that allows either a static or dynamic list of choices by including the choices – and the selection state – right in the form data.

First, create a data structure as follows:

Here are the steps to do this:

  1. Go to the Data Source task pane
  2. Click the Add button, and add a node named “options” of type Group
  3. Add a node under options named “option” of type Group and check Repeating
  4. Add a node under option named “selected” with data type True/False (boolean)
  5. Add another node under option named “text” (with the default properties)

Note that if you want a very different data structure the rest of these instructions won’t apply directly, but they should get you started down the right path in terms of understanding how to create a complex control out of the primitives that InfoPath provides.

Now you need to build the view – here’s what I came up with, showing the design-time structure:

This is a Scrolling Region as the outer container for the control, containing a Repeating Table for the options, with a Check Box and Expression Box for each option. Here’s how you make it:

  1. Go to the Controls task pane
  2. Insert a Scrolling Region control, and resize it to the size you want the Multi-Select List Box control to be.
  3. Go to the Data Source task pane
  4. Drag the option group from the task pane into the Scrolling Region control; when the popup menu appears, select Repeating Table
  5. Double-click the Repeating Table indicator to show its properties
  6. On the Data tab, uncheck Allow users to insert and delete rows
  7. On the Display tab, uncheck Include header, then click OK
  8. Inside the Repeating Table, delete the text next to the check box in the first cell (which should say “Selected”), and resize the table cell so that the checkbox just fits within it
  9. Right-click the Text Box in the second cell, point at Change To and select Expression Box on the fly-out menu

Next, tweak the layout and borders to make it look professional:

  1. Double-click the Scrolling Region indicator
  2. On the Size tab, set the Top, Bottom, Left and Right Padding to 0 px, then click OK
  3. Select Format | Borders and Shading…, click Outline, then click OK
  4. Select the Repeating Table indicator, then go to Format | Borders and Shading…, select None, and click OK
  5. Click inside the Scrolling Region – although you can’t see them, there will be several empty paragraphs. Arrow down until the blinking insertion point is in the last paragraph, then hit Backspace to erase them. (If you forget to do this you may see blank lines after the options when you preview the form.)

Finally, if you want to make the selected options stand out clearly, you can use Conditional Formatting:

  1. Click the Repeating Table indicator, then go to Format | Conditional Formatting… and click Add…
  2. In the third drop-down, select TRUE (so the condition reads “selected” “is equal” “TRUE”)
  3. Click the Shading drop-down, and select a background color (e.g. light gray)

At this point, the Multi-Select List Box control is ready to go – but it doesn’t have any options! Maybe those options are specified by your form’s back end data source (a database or web service). But for now, let’s assume the list is static:

  1. Go to Tools | Default Values
  2. Right-click on the option node, and select Add another option below; repeat this to create as many options as you need.
  3. Expand each option, select the text node, and type the option name in the Default value text box at the bottom of the dialog. (To make an option selected by default, select the selected node and then select TRUE in the Default value drop-down.)

That’s it! Now just hit the Preview button on the toolbar to try our your new Multi-Select List Box control.

Note: You can also create ActiveX controls that do XML data binding with the InfoPath SP1 Preview.

Advertisements

One Response to “Create a Multi-Select List Box with InfoPath 2003”

  1. Creating a Multiple selection List Box in browser enabled InfoPath form 2007.

    It is believed that browser enabled InfoPath forms do not support multiple selection list box. But there is a work around for this.

    I have posted a step-by-step approach along with the source code to make
    multiple selection list box a possibility with browser enabled InfoPath forms.

    Read my full post at: http://www.sharepointfix.com/2010/03/creating-multi-select-list-box-in.html

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: