Digital Signatures: Layout Tricks

Folks frequently ask whether it is possible to customize the InfoPath user interface around digital signatures. Some want to show the signature at the very bottom of the form; others want to show signatures side-by-side; others want to disable form submissions when the document wasn't digitally signed. In this article, we'll look at different ways you can tweak the form design to make it happen.

Trick 1: Display signature at the bottom of the view

InfoPath lets you show digital signature UI ("click here to sign this form") under a signable section; however, this section doesn't have to include any controls! This means that you can have your signable section with controls at the top of the form, some extra content in the middle, and then another section bound to the same nodes in the data source without any controls in it.

Your design view would look like this:

Note how the signableGroup here is multiply bound; the first section has the "allow users to digitally sign this section" checkbox unchecked:

The second one has it checked, which makes the "click here to sign this form" show up; this is how the end result looks at edit-time:

Trick 2: Disallow Submit if form was not signed

InfoPath digital signatures are appended to form XML, just like form data. For example, in the form above, nodes under signature1 will store the digital signature when the user adds it:

Using this fact, we can enforce business rules in our form: for example, what if we don't want to allow form submissions for cases when form is not signed? Let's go to Tools | Submit Options and create two rules:

1) Show must-sign warning:

    - condition: signatures2 node is blank (this will evaluate to true when no signature was added)

    - action: show a dialog box message "you must sign the form before submitting it"

    - check "stop processing rules when this rule finishes"

2) Submit to main data source:

    - condition: always applies (unless the first rule fired - we wouldn't get to this execution point then)

    - actions: submit to main data source + show dialog box message "submission was successful"

Trick 3: Show signatures side-by-side

Challenge: make a form that has signatures side-by-side at the bottom; additionally, person 3 should only be able to add their signature if previous signer (person 2) already signed the document.

We already know how to make the signatures appear at the bottom of view (trick 1); we also know how to determine if a signature was added to the document (trick 2). Let's put all of these tricks together into one powerful solution:

- Create 3 different signed data blocks, one for each person that will be signing the form. Second data block needs to signing a superset of data that the first one signed, etc.  Your data source task pane will look like this: 

- Place empty sections bound to the items that you want to sign in the columns of that table.
- Use containing conditionally-formatted sections to show the signing UI only when necessary.

The resulting layout will look like this:

I'm attaching a sample form template that has this trick implemented (works in InfoPath 2003 or 2007; save the XSN to your computer before opening it).

Alex Weinstein
Program Manager

DigitalSignaturesLayoutTricks.xsn

Comments

• Anonymous
  February 01, 2007
  I have 2 questions on digital signatures

1. With InfoPath 2003, data only gets signed, therefore it is extremely easy to add additional content to the form after the user has signed it.  You can even remove the signature of the signed form, but I suppose you’ll know that the form has been tampered with, when this occurred.  Any way to get round this?
2. When different users are using the same workstation, it can get a bit confusing with who can read and write to the forms.  Has this been resolved in 2007.

• Anonymous
  February 02, 2007
  The comment has been removed

• Anonymous
  September 04, 2007
  I cannot  open the attachment DigitalSignaturesLayoutTricks.xsn  with infopath 2003. Any sugesstions?

• Anonymous
  December 27, 2007
  Hello, I tried this solution on InfoPath 2007 and worked very well. The problem is when i publish the form to a Sharepoint Document Library and open the form with Form Services. When I sign the form by the browser i have an error: "Sign checking error", but if i open the form with InfoPath (taking it from Sharepoint) the signing is correct What´s the problem with form services and digital signature?

• Anonymous
  March 25, 2010
  I tested digital signatures in Firefox and coming with a message of "Digitally signing this form is not supported in the current browser". Has anyone tried using digital signatures in Firefox or Safari? Thanks.

• Anonymous
  March 25, 2010
  Firefox can validate a digital signature, but applying a digital signature depends on ActiveX technologies that are only available through Internet Explorer. Therefore, this is By Design.

• Anonymous
  October 21, 2010
  The comment has been removed

• Anonymous
  November 30, 2010
  I know this post is old, but is there more information about setting up "Trick 3"? I cannot seem to get the same data source designed as shown in the post. Are the three Signableblock# created from inside the Data Source:MyFields and not in the form? Just having trouble making it work. Thanks,

• Anonymous
  May 05, 2014
  Great demo! I am try to add two signatures for the section I of my form, in additional to the three signatures at the bottom of the section II of the form. I tried many times that copy your three-signature, and changed it to 2-signature, but only problem is I don't have your XML source code, and I am not good at Visual Studio. I am using InfoPath 2010, and will use SharePoint 2010 Workflow. Any help or advise please. my email: ksho888@hotmail.com