This article is taken from the book SharePoint 2010 Workflows in Action. The author shows walks you through the steps involved in customizing the out-of-the-box forms
Get 40% off any version of SharePoint 2010 Workflows in Action with the checkout code dnspark40. Offer is only valid through www.manning.com.
A new feature in InfoPath 2010 is the ability to customize out-of-the-box
auto-generated forms. Even if you choose the out-of-the-box approach and later
decide you need more functionality, you can customize those forms with InfoPath.
This article walks you through the steps involved in customizing the
Data storage methods differ significantly between
using a form in a form library and using InfoPath to customize the
out-of-the-box New and Edit forms. A form in a form library stores its data as
XML, which is uploaded as a document in that library. When you customize the
out-of-the-box forms, that data still needs to be mapped to columns in the list
item. If you have a good deal of data, you may want to go the form library
route, rather than add 20 columns to the list item. You may want to change the
behavior of one or two columns or possibly brand the form with a company logo or
more detailed instructions. In this case, customizing the out-of-the-box forms
is an excellent approach.
SharePoint Server required when customizing the
This article describes features available only to
the Server edition of SharePoint 2010.
To get started, first create a
SharePoint list or library and onto that list add all the columns you need to
track. You can do this through the List Settings and then Add a column option.
After you have all your columns set up for your data requirements, edit the
forms to suit your user interface requirements. In the Ribbon's List tab, you
can use the Customize List dropdown and choose Customize Form (figure 1) to
launch InfoPath.Figure 1 To customize the out-of-the-box forms
in a list or library, click the Customize Form button in the Ribbon to launch
The example you're going to build involves a tasks list, and each
task has an associated Project and Sub Project. What we want to do is change the
lookup columns for these associated projects to be dynamic. As a result, the Sub
Project dropdown will change its items based on the selected Parent Project,
when you select a project. Figure 2 shows what the tasks form looks like when
it's first opened in InfoPath. Notice the Parent Project and Sub Project columns
that you'll alter.
Figure 2 When you first select to customize
the out-of-the-box New and Edit forms on a list or library, InfoPath is loaded
with all the columns on that list or library, and you can start editing their
behavior or appearance.
The Parent Project column is a lookup column for a
separate list called Project Names. Sub Project is another lookup column for a
second separate list called Sub Project Names. The Sub Project Names list has
two columns, Title and Parent Project. Parent Project is a lookup for the
Project Names list. Before continuing, set up the two Project Names and Sub
Project Names lists as previously described. Then, add a Project Name lookup
column and a Sub Project Name lookup column to a Tasks list. Last, edit the
out-of-the-box form in InfoPath as shown in figure 1.
To make the Sub
Project dropdown in your tasks form dynamically, select its items based on what
is selected in the Parent Project dropdown. First, create a new data source for
the Sub Project dropdown. The default data source for this dropdown only has two
fields, Title and ID. Because you need to filter on the Parent Project column,
add a new data source. Then, filter that data source on the selected Parent
Project. And last, set up a rule on the Parent Project dropdown to ensure the
data source is updated each time the dropdown is changed. The steps in table 1
will walk you through this process.Table 1 Setting up dynamic dropdowns
in an InfoPath Form
|While customizing the out-of-the-box task edit form in InfoPath, set
up a new data source for the Sub Project's dropdown menu.
||1. In the Data tab in InfoPath's Ribbon, click on the Data
Connections button. Click on the Add button to add a new data source.
Select the radio buttons to create a new data source that receives data. Click
3. Choose to receive data from a SharePoint library or list. Click
4. Type the URL to the SharePoint site that contains the Sub Project
Names lists, click Next and then continue with the wizard.
|You'll be halfway through the new data source creation wizard.
|Specify your list and columns to be included in the data source.
||5. Select the list name that contains the data for your connection
(in this case, Sub Project Names) and click Next.
6. Select the columns to
include in the data source (in this case, Title, Parent Project, and ID
columns). Click Next twice.
7. Give the data source a name like Sub Projects
Filtered by Parent Project Selection. Click Finish to complete the data source
wizard, and then Close.
8. Change the Sub Project dropdown to use this data
connection instead of the default connection by right-clicking on the dropdown
and choosing Drop Down List Box Properties. Then, change the Data Source
dropdown menu to be the data connection that was created and click OK.
|A new data connection will be available, and the Sub Project dropdown
will be set to use this new connection. |
|Filter the new data source on the selected parent project. In the
Entries box directly below the Data Source selection on the Sub Project
dropdown, you'll see the XPath query that points to the data. Click the Select
XPath button directly to the right of the text box. (Click the ellipses image.)
Follow these steps to set up the filter.
In the Select a Field or Group dialog box, click the Filter Data button and then
2. The first dialog box contains the fields in your custom data
source. Select the Parent Project field. Leave the comparing field (middle
dropdown) set to is equal to.
3. In the third dropdown, choose Select a
field or group. Another dialog box will appear; change the Fields dropdown to
Main to select the data that is represented on the form itself.
4. There are
two sub folders: the queryFields folder will query fresh data and the dataFields
folder contains the data on the form at the present time. Expand the dataFields
5. Expand the sub folder containing the list item data. Select the
Parent Project field. Click OK five times.
|Now your Sub Project dropdown is correctly filtering its data
according to the Parent Project dropdown's selected value. The last thing you
need to do before you publish the form into our SharePoint tasks list is to set
up a rule on the Parent Project dropdown. Each time the Parent Project
dropdown's value is changed, you need to tell the Sub Project dropdown to update
||1. Right-click the Parent Project dropdown and, under the Rules
flyout, select Manage Rules.
2. Click the New dropdown in the Manage Rules
toolbar and select Action.
3. Give the rule a name like Update Sub Project
4. Next to Run these actions, click the Add dropdown and select
Query for data.
5. In the Data Connection dropdown, select the custom data
connection you created earlier. In this case, select Sub Projects Filtered by
Parent Project Selection and then click OK.
|With the rule in place on the Parent Project dropdown, the data
source for the Sub Project dropdown will update each time the parent dropdown
That's it! Now all that's left is to
publish the form into your tasks list. Under the File menu in the Info tab,
click Quick Publish. Now, when you go to create a new task in your tasks list,
the Sub Projects dropdown will be dynamically populated based on what Parent
Project is selected (figure 3)!Figure 3 You can customize the out-of-the-box
New and Edit forms to make lookup columns in your lists or libraries dynamically
generate their items based on custom rules.
Only Positive Integers Allowed
If you get an error that says Only Positive Integers Allowed,
you're trying to save a string into a column that is expecting a number. Most
likely the Sub Project dropdown's value is set to a string but, because the
column is a lookup, it needs to be a number instead. To fix this error,
right-click on the Sub Project dropdown and choose Dropdown list properties.
Then, underneath Entries, change the Value from d:Title to d:ID. After you
republish the form, the form should start saving
Three main tools for building custom forms in
SharePoint are out-of-the-box forms, InfoPath forms, and ASP.NET forms with
Visual Studio. The out-of-the-box forms provide the easiest and fastest approach
to giving your end users an interface that can accept data and information. The
out-of-the-box forms have their limitations. When a more complex form is
required, InfoPath is the next best choice. Be aware that SharePoint Server
edition is needed to host InfoPath forms in the browser; otherwise, you'll need
to have the InfoPath client installed on all your end user's workstations.