Amal Nagm

Introduction to designing form templates for mobile devices

Form controls and features that are not supported in mobile device browsers

Support for form controls

InfoPath 2007 control	Desktop browsers	Mobile device browsers
Text box
Check box
Button
Expression box
List box
Drop-down list box
Repeating section
Hyperlink
Option button 1
Optional section 2
Repeating table 3
File attachment control
Date picker 4
Rich text box
ActiveX control
Bulleted list control
Choice group
Choice section
Combo box
Horizontal repeating table
Horizontal region
Ink picture control
Master/detail control
Multiple-selection list box
Numbered list control
Picture control
Plain list control
Repeating choice group
Repeating recursive section
Scrolling region
Vertical label

Support for business logic

InfoPath 2007 feature	Desktop browsers	Mobile device browsers
Formulas 1
Data validation
Rules
Conditional formatting 2
User roles

General design advice

• When users fill out a form on a mobile device, they must click the Update button on the mobile device toolbar to trigger a calculation or some other other type of business logic. Each click of the button forces the mobile device to submit data to the server, a process called a postback. To make it easier on the user, consider adding a button to the form template that automates the postback. For example, suppose your form includes a Total field that totals the numbers in three other fields on the form. In that case, you might add a Show Total button next to the Total field, so that users remember to refresh the fields in the form.
• Rather than insert all of the controls on a single view (view: A form-specific display setting that can be saved with a form template and applied to form data when the form is being filled out. Users can switch between views to choose the amount of data shown in the form.), consider a design that has multiple views, especially for the display of conditional controls. Multiple views on a form help prevent a single view from becoming too large or complex, and therefore difficult to use on a small screen.
• If the form has multiple views, add buttons that help users to navigate between views.
• Use list boxes wherever possible; it is difficult to type on a mobile device.

Design a form template for use on a mobile device

• Step 1: Specify a compatibility setting for the form template

• Step 2: Specify a mobile device setting for the form template

• Step 3: Create a document library to store the completed forms

• Step 4: Specify submission options for the form template

• Step 5: Publish the form template to a server

• Step 6: Associate the form template with the document library

• Step 7: Test and debug the form template

Step 1: Specify a compatibility setting for the form template

1. On the File menu, click Design a Form Template.
2. Under Design a new in the Design a Form template dialog box, click Form Template.
3. In the Based on gallery, do one of the following:
   • To define the data source as you design the form template, click Blank.
   • To use a Web service as the data source for the form template, click Web Service. This option lets you query or submit data to a Web service.
   • To use a Microsoft SQL Server database as the data source for the form template, click Database. This option lets you query data from a SQL Server database.
   • To use an XML document (.xml) file or an XML Schema (.xsd) file as the the data source, click XML or Schema.
   • To use information in a data connection file (data connection file: A file that stores information about a connection to a data source, such as an Access database, a spreadsheet, or a text file, and that facilitates data source administration.) as the basis for the data source, click Connection Library.
4. To make your form template compatible with a server running InfoPath Forms Services, select the Enable browser-compatible features only check box, and then click OK.
   
   A new form template opens in InfoPath, with the text, Compatibility: InfoPath and InfoPath Forms Services in the status bar. The purpose of the text is to inform you that either InfoPath or a Web browser can display the active form template.
5. Add controls, data validation, or any other features to the form template. As you design your form template, remember that mobile browsers do not support some of the controls that desktop browsers support.
   Note The Design Checker task pane will not warn you that a control or feature in your form template is not supported in mobile device browsers. To double-check support for a control or feature, see the Form controls and features that are not supported in mobile device browsers section later in this article.

Step 2: Specify a mobile device setting for the form template

1. On the Tools menu, click Form Options.
2. In the Form Options dialog box, click the Browser category.
3. To add an Update button to the toolbar of the mobile device, under Include the following commands on the toolbars, in the Toolbars section, select the Update check box.
4. Under Mobile Devices, select the Enable rendering on a mobile device check box.
   
5. Click OK to return to the form template.
6. Save the form template to the location of your choice.

Step 3: Create a document library to store the mobile forms

1. Using a browser, open the SharePoint site where you want to store user forms.
2. Click View All Site Content, and then click Create on the All Site Content page.
   Tip In most cases, you can use the Site Actions menu as well.
3. Under Libraries, click Document Library.
4. In the Name box, type a name for the new library.
   The name will appear at the top of the library page, become part of the address for the library page, and appear in the navigational elements that help users to find and open the library.
5. In the Document Template section, in the Document Template list, click None, and then click Create.

Step 4: Specify submission options for the form template

1. In InfoPath, open the browser-compatible form template that you created in step 2.
2. On the Tools menu, click Submit Options.
3. In the Submit Options dialog box, select the Allow users to submit this form check box.
4. In the Send form data to a single destination list, click SharePoint document library.
   
5. To add a new data connection, click Add. The Data Connection Wizard dialog box opens.
6. In the Document Library text box, type http://<ServerName>/<LibraryName>/Forms/AllItems.aspx, where <ServerName> is the name of the SharePoint server that is running InfoPath Forms Services, and <LibraryName> is the name of the library.
   Note If the document library is not located on the root site, you must insert the site name in the URL. For example, http://<ServerName>/<SiteName>/<LibraryName>/Forms/AllItems.aspx
7. Click the button to the right of the File name text box.
8. In the Insert Formula dialog box, click Insert Function. The Insert Function dialog box opens.
9. Click the Text category, click the concat function, and then click OK.
   
10. In the Insert Formula dialog box, click the first occurrence of the text "double-click to insert field" in the Formula box to highlight it, and then type 'form'. Include the single quotation marks.
11. Click the second occurrence of the text "double-click to insert field" in the Formula box to highlight it, and then click Insert Function.
12. Click the Date and Time category, click the now function, and then click OK.
    Tip The now function lets you automatically add the current date and time to the form name.
13. Delete the remaining "double-click to insert field" items in the Formula box.
14. Delete the extra space and the comma, so that the formula box contains the formula concat('form', now()), as shown in the following image.
    
    When users submit their form to the library, the form will be named according to this formula. Each submitted form will have a unique name.
15. To return to the Data Connection Wizard dialog box, click OK.
16. Click Next, and then click Finish.
17. To return to the form template, click OK.
18. On the Tools menu, click Form Options, and then click the Browser category.
19. Under Toolbars, select the Submit check box, adn then click OK.
20. Save your changes.

Step 5: Publish the form template to a server

1. The form designer must publish an .xsn file to a shared location. The .xsn file contains information about the server where the form template will ultimately appear.
2. The farm administrator must upload the form template to the server and optionally verify that the form template is free from errors.
3. The farm administrator or site collection administrator must activate the form template to a site collection (site collection: A set of Web sites on a virtual server that have the same owner and share administration settings. Each site collection contains a top-level Web site and can contain one or more subsites.) on the server, which makes the form template available to people using mobile devices.

Prepare the form template for administrator approval

1. On the File menu, click Publish.
2. In the Publishing Wizard, click To a SharePoint server with or without InfoPath Forms Services, and then click Next to open the next page of the wizard.
3. In the Enter the location of your SharePoint or InfoPath Forms Services site box, type the location of the SharePoint site where the forms will be stored, and then click Next to open the next page of the wizard.
4. Review the settings, and note that the form template requires aministrator approval.
   
   Click Next to open the next page of the wizard.
5. In the Specify a location and file name for the form template box, click Browse.
6. In the Browse dialog box, browse to a location that the farm administrator can access, and then in the File name box, type the name of the form template and click Save.
7. Click Next to open the next page of the wizard.
8. If you want specific fields in the form template to show as columns in the document library, click the Add button, select the fields you want, and then click OK. Otherwise, click Next to open the next page of the wizard.
9. Verify that the information is correct, and then click Publish to save your form template (.xsn) file to the specified location.
10. Click Close.
11. At this point, you must ask a farm administrator to upload the form template to the server and then activate it to a site collection.
    Tip To watch a demo of the upload and activation process, see Demo: Deploy an administrator-approved form template

Step 6: Associate the form template with the document library

1. Using a browser, open the document library you created in step 3.
   Tip The path should be something like http://<SeverName>/sites/team/<LibraryName>/Forms/AllItems.aspx, where <ServerName> is the name of your SharePoint site, and <LibraryName> is the name of the library where the forms will be stored.
2. In the library, on the Settings menu , click Document Library Settings.
   
3. Under General Settings, click Advanced settings.
4. In the Content Types section, under Allow management of content types, click Yes.
5. Click OK to return to the Customize Library Name page.
6. Under Content Types, click Add from existing site content types.
7. Next to Select Content Types, click the name of the form template in the Available Site Content Types list.
   
8. Cick Add.
9. Click OK to return to the Customize Library Name page.
10. In the Content Types section, click Document.
11. Under Settings, click Delete this content type, and then click OK.
12. Return to the document library, and click the New button to make sure that the appropriate form opens.
    Note By default, the form will open in InfoPath. If you want to force the form to open in a browser, go back to the advanced settings page for the document library. Next to Browser-enabled Documents, click Display as a Web page, and then click OK.

Step 7: Test the form template