Display Rich Content in an Expression Box - Greg Collins
in

InfoPath Dev

This Blog

Syndication

Greg Collins

Display Rich Content in an Expression Box

When you bind an Expression Box to a Rich Text field you might be surprised to find that all of the formatting and rich content are gone, and that you are left with a single-line string of plain text. Getting the rich content to display requires only a small manual modification to the view .xsl file.

In this task we will create an Expression Box bound to a Rich Text field that displays with rich content. We will also look into an issue you might experience as a result of this modification and what can be done about it. Let's start by designing a new blank form.

Create a Rich Text Box and bind an Expression Box to it:

  1. Open the Controls task pane.
  2. Insert a Rich Text Box into the view.
  3. In the Data Source task pane, right-click field1, and then choose Expression Box.
  4. Resize the Expression Box to be the same width as the Rich Text Box above it.

Try it:

  1. Preview the form.
  2. Add some rich content to the Rich Text field, and then click outside of the field to bind the content.


Figure 1. An Expression Box bound to a Rich Text field does not display rich content.

As you can see in Figure 1, the rich content is not displayed in the Expression Box. This is because InfoPath does not consider the data type of the bound field when creating an Expression Box but instead always uses the xsl:value-of element in the XSL. The xsl:value-of element converts the results of its selection to a string by calling the string() function. To allow for rich content, we must change to use the xsl:copy-of element.

Modify the view .xsl file to allow the Expression Box to display rich content:

  1. Choose Extract Form Files from the File menu.
  2. Select a location to save your extracted form files to, and then click OK.
  3. Close InfoPath to release the lock it places on your form files.
  4. Using a text editor, open your view .xsl file.
  5. Search for the text ExpressionBox to locate the span element that represents your Expression Box control.
  6. Change the following line from:

<xsl:value-of select="my:field1"/>

to:

<xsl:copy-of select="my:field1/node()"/>

  1. Save the view .xsl file, and then close the text editor.
  2. Reopen your form template by right-clicking the manifest.xsf file and choosing Design.

Try it:

  1. Preview the form.
  2. Add some rich content to the Rich Text field, and then click outside of the field to bind the content.


Figure 2. The modified XSL allows the Expression Box to display rich content.

Figure 2 shows that the modification we just made to the XSL allows the Expression Box to display rich content. Something you might have noticed was that if you hover over the contents of the Expression Box, a blue border appears around the field. This is uncharacteristic of an expression box, and usually an undesirable effect.

There is an issue in InfoPath that causes this blue border to appear when hovering over an Expression Box modified to display rich content when a Rich Text Box bound to the same field is in the same view. To prevent this blue border from appearing on hover, you must ensure that the Expression Box does not appear in the same view as a Rich Text Box. If the two controls are in separate views, this hover effect will not occur.

©2005 Greg Collins. All rights reserved. Licensed to Autonomy Systems, LLC for display on InfoPathDev.com.

Comments

No Comments
Copyright © 2003-2019 Qdabra Software. All rights reserved.
View our Terms of Use.