Creating Browser-Enabled InfoPath 2010 Forms
InfoPath allows users to create complex forms with great ease. It
increases productivity. Users can now
create sophisticated forms that can be opened in the desktop client
software or in the browser. InfoPath
provides users the ability to create XML based electronic forms.
InfoPath is an excellent data gathering
tool. InfoPath 2010 comes with two flavors: InfoPath Designer and
InfoPath Filler. As the name suggests,
Filler is used to fill out the forms whereas Designer is the tool
that you use to create forms.
Below you will see how you can create browser-enabled InfoPath
forms and deploy them in SharePoint.
Purpose of this article is to show you how to overcome the hurdles
that you find during the whole
process. On the paper, it all seems very simple but is it really
that simple? If you have done some
development with the modern day tools and technologies, you will
agree that things are not as simple as
they seem. You don’t have to be a master of everything but you have
to have some basic skills in all
technologies that are inter-related. In this case, you need to have
information about InfoPath, SharePoint
development, SharePoint configuration, SharePoint Administration,
setup of servers and services, etc etc.
So, below I will show you how to resolve the most common problems
that you face when you start
developing InfoPath applications for the first time.
Create Form Library
1. First we will setup a form library in SharePoint. We will
publish our form to this library. Open
SharePoint site. Click Site Actions and select View All Site
2. Click Create.
3. Select Library from the Filter By and select Form Library from
4. Enter UserRegistrationLib in the Name box and click
5. Click Library Settings in the ribbon.
6. Click Advanced settings (under General Settings).
7. In Content Types, select Yes in Allow management of content
Figure 2: Content types
8. In Folders, select No in Make “New Folder” command
9. Click Ok. The library has been created. Now we will create the
form. We will return to this
library for some more settings after the form has been created and
10. To create the form, open InfoPath designer (All Programs >
Microsoft Office > Microsoft
InfoPath Designer 2010)
11. Our template will be stored in a SharePoint Form Library but
first we need to check if
everything is in place and InfoPath is able to connect to the
SharePoint site. To check this, in a
Figure 3: SharePoint List Template
12. Enter the location of the SharePoint site and click Next.
Figure 4: SharePoint Site Path
13. You will be prompted for username and password. Please provide
the credentials and click OK.
If you have just setup your environment, there is a great chance
that you will see your first hurdle in this
step. You may see following error:
Figure 5: The operation could not be completed.
If you don’t get an error, please continue with the next steps. To
fix the issue, click Show Details button
in the error message. Most probably, it will show you “Unable to
connect to the SharePoint site.”. Now I
am sure that there is nothing wrong with the site and you can
access it in the browser. Here are some tips
that will help you find the cause:
Check that you have created a site collection and the site you are
trying to access is part of this site
collection. It’s a bug that I have discussed in one of my blog
entries. If you don’t create a site collection
and try to access SharePoint through SharePoint designer or
InfoPath, you get an error.
Check if you have enabled SharePoint enterprise feature in your
a. Open Site Actions (in your SharePoint site) and select Site
Figure 6: Site Settings
Figure 7: Site collection features
c. Make sure feature SharePoint Server Enterprise Site Collection
features is activated.
Figure 8: SharePoint Server Enterprise Site Collection
Tip 3 is to check your URL. How are you accessing your site? If you
have setup a domain name, then
accessing the site using FQDN will work in browser. Using same URL
in InfoPath to connect to the site
may throw error. Therefore, if your full site URL is like
http://server.sharepoint2010.com then just use
http://server in InfoPath and see if you can connect. In this URL,
sharepoint2010.com is the domain
name and server is your server name. Just using the server name
will resolve your problem.
14. Now that we are sure that we can connect to the SharePoint,
cancel this operation. Click File tab
and this time select (double-click) SharePoint Form Library.
InfoPath designer will show a new
Figure 9: Default InfoPath Form Design
15. To edit this form, click Click to add title and enter User
16. Click first heading Click to add heading and enter Personal
17. To change field name, click it and enter a new name. Enter
following field names/labels in the
18. Click second heading Click to add heading and enter
19. Add following field names/labels in this second section:
c. Experience (Number of years)
20. Now, it’s time to add controls. Add following controls from
Controls section of the ribbon.
Field name: FirstName
Field name: LastName
Field name: Address
Field name: City
Field name: State
Field name: Zip
Field name: Country
Field name: Phone
Field name: Email
Field name: Web
Field name: Description
Field name: Skills
Field name: Experience
Height: 90 px
21. Add a button control at the bottom. Open button properties. In
Action, select Submit. In Label,
enter Submit and then click Submit Options. On Submit Options
dialog box, check Allow
users to submit this form. Select Send form data to a single
destination and select
SharePoint document library from the drop down. Click Add
Figure 12: Submit Options
22. Enter Form library path name in Document Library. We created
form library in the steps above
and named it UserRegistrationLib. The path will be something like
Figure 13: File name
24. Click Insert Function button. Select concat from the functions
and click Ok. Concat function
will have three parameters. Delete first parameter and add “Form-“
in its place. Click on 2 nd
parameter and then select Insert Function button. Select now from
the functions. Click OK.
Click Verify Formula button to verify it. Click OK. This will give
a unique name to the form
every time you submit the form.
Figure 14: Insert Formula
Publish the Form
27. Click on Developer tab and then click Language button in the
ribbon. This will open Form
Options. Select Programming from the Category. Select C# in Form
template code language.
You can change the project location if you want.
Figure 15: Form Options
28. Click Security and Trust in Category. Uncheck Automatically
determine security level.
Select Full Trust. Administrator –approved form cannot be published
unless they have full trust.
Check Sign this form template and click Create Certificate button.
You will be shown a
prompt. Click OK. This will create a self-signed certificate for
you. This certificate will be valid
for 30 days.
Figure 16: Form should have full trust and should be signed
29. Click OK to close the options.
30. Now it’s time to publish the form. Select File > Publish.
Click SharePoint Server.
31. Enter form library path and click Next.
32. Make sure Enable this form to be filled out by using a browser
is checked. Select
Administrator- approved form template and click Next.
33. Click Browse button and select a path on your drive to store
the template file. It can be any folder
on your drive. Enter File name for your form, for example,
UserRegistrationForm and click
Save. Later you will upload this form to the server. Click
34. Click Add to add promoted fields. Select FirstName and click
35. Again click Add and select LastName and click OK.
36. Click Next and then click Publish.
37. Click Close.
38. Open central administration site. Click General Application
Settings. Click Manage form
templates under InfoPath Forms Services.
Figure 17: Manage form templates
39. Click Upload form template.
40. Click Browse and select the form that you published (saved on
41. Click Upload.
42. Click OK.
43. Right-click published form and select Activate to a Site
Figure 18: Activate form to a Site Collection
44. Make sure correct site collection is selected . You will have
to worry about it if you have multiple
site collections otherwise the default site collection will be
selected automatically. Click OK.
Form Library Settings
45. Now we will return to the form library and make some more
changes in the settings. Open the
library settings page. In Content Types, click Add from existing
site content types.
Figure 19: Add from existing site content types
46. Select the published template from the list of available
content types and click Add. Click OK.
Figure 20: Add content type
47. In Content Types, click Form and in Settings, click Delete this
content type. Click OK.
Testing the Form
48. Open library. To open click library name in Libraries. Click
Figure 21: Test InfoPath form
49. The form will open in browser. Enter some data and click Submit
button in the form.
Figure 22: InfoPath form in action
50. Form will be saved in the library. Form name will consist of
“Form-“ string and current time.
This way form name will be unique every time you submit the form.
This can be changed to
have a different form name. For example, you may want to use a
unique ID to append to the form
name instead of using current time. This can be done using
different techniques. Some people use
a workflow to generate a unique ID. This can also be achieved by
storing a seed number in a
SharePoint list and using this unique number in the form
Figure 23: Form library showing submitted form
51. You will notice that the form shows its own ribbon at the top.
This can be disabled. If you use
buttons in the form then its better to disable the buttons in the
ribbon to save users from
confusion. OR you can use the ribbon buttons instead of adding new
buttons to the form. If you
want buttons other than Submit, Save, Close, etc then you will have
to add them to the form. To
disable the ribbon buttons, in InfoPath designer, click Developer
tab and select Language
button. This will open Form Options. Select Web Browser in
Category. If you want to remove
the ribbon, uncheck Show InfoPath commands in Ribbon or toolbar.
You can choose where to
show the ribbon: top, bottom or both. If you chose to show the
ribbon, you can select which
buttons to show in the ribbon. Check the ones you want to show and
uncheck those that you don’t
want to show. Click Ok and re-publish the form to see the
Figure 24: Hide/Show ribbon commands
Download InfoPath template and published form from the following
This article was taken from the upcoming ebook “Installing and
Configuring SharePoint 2010 2 nd
Edition”. The 2 nd
edition has updated information about installing and configuring
SharePoint 2010 and
has new bonus chapters. To download your free copy, visit our blog
soon. You can subscribe to our blog
to stay up-to-date.