NOTE: This article was written for the original InfoPath 2003, which did not support secondary data sources. You can still use code to populate a drop-down list box, but the better approach is to have the drop-down list populate from a secondary data source, and then use code to add nodes to that list in your secondary DOM.
- - - - -
Populating a drop-down list box in InfoPath is easy, but you might need to something more complex than the designer allows. This is possible with some work on your part. Although very powerful, populating a drop-down list box via code requires that you use a Preserve Code Block.
In this task we will populate a drop-down list box via code. The drop-down list box will exist inside of a section that will be used to create the Preserve Code Block. Let's start by designer a new blank form.
Design the view:
- Open the Controls task pane.
- Insert a Section into the view.
- Insert a drop-down list box into the section.
Write code to return a list of options:
- Press ALT+SHIFT+F11 to open the Microsoft Script Editor.
- Insert the following function:
|
Java Script:
function PopulateDropdown(sSelectedValue)
{
return "<option value=''>Select...</option><option value='Test'>Test</option>";
}
C#:
public string PopulateDropdown(string sSelectedValue)
{
return "<option value=''>Select...</option><option value='Test'>Test</option>";
} |
- Save your code, and then exit the Microsoft Script Editor.
Modify the view .xsl file to create a Preserve Code Block:
- In the InfoPath designer, choose Extract Form Files from the File menu.
- Select a location to save your extracted form files to, and then click OK.
- Close InfoPath to release the lock it places on your form files.
- Using a text editor, open your view .xsl file.
- Locate the xsl:template that contains your drop-down list box.
- Replace the mode="_nn" attribute with mode="xd:preserve" for both the xsl:template element and its associated xsl:apply-templates element.
The mode attributes will have matching values in both the xsl:template and xsl:apply-templates elements.
- Replace all the option elements listed for this drop-down list box with the following code:
|
<xsl:value-of select="xdExtension:PopulateDropdown(string(my:BoundField))" disable-output-escaping="yes"/> |
Where my:BoundField is the same value as that of the xd:binding attribute on the select element.
- Save the view .xsl file, and then close the text editor.
Try it:
- Launch your modified solution by double-clicking the manifest.xsf file.
In the InfoPath editor you will see a drop-down list populated with Select... and Test.
- Choose Design This Form from the Tools menu.
- In the InfoPath designer you will see a red box indicating your Preserve Code Block.
You can now modify the PopulateDropdown function to process whatever information is required to populate your drop-down list. The string returned must not contain any XSL code, but only contain properly formatted HTML with option elements.
You will need to use the sSelectedValue parameter to identify which of the option elements is the currently selected option. You must make sure that, in your code, you set the selected="selected" attribute on the correct option element. Otherwise the drop-down list in the view will never show the selected value, but will instead always revert back to displaying the first option in the list.
This technique is demonstrated in my example forms: Fully Editable Drop-Down List Box and Moving Items Between List Boxes.
©2004 Greg Collins. All rights reserved. Licensed to Autonomy Systems, LLC for display on InfoPathDev.com.