RichText tricks for TextField in Designer

May 20th, 2009

This post describes a technique to set rich text content into a Textfield of a form that was designed in LiveCycle Designer ES. Thanks to Paul Guerette who helped me out to understand this few months back.

There can be two scenarios in which you might want to set content into a rich text supported Textfield.

  1. User types the rich text content into a text field and you wish to copy that to another Textfield.
  2. LiveCycle ES server/some other way you wish to set rich text content into a form field. (Form pre-population scenario)

Where is rich text data in a text field?

When user types plain text in a pure Textfield (field format: Plain Text Only) then the data is set/get from rawValue property. BUT if the Textfield is having Rich Text as the field format then the data is store at .value.exData

How to check what the rich text data look like under the covers?

I use email submit button on a simplest form to see the XML that gets created for submission.

If you wish to do this then:

  1. Create a simple dynamic PDF form and put a text field with Rich Text format set to it.
  2. Drop a Submit button and put mailto:someone@abc.com as submit URL
  3. Open this sample form in Preview mode type some text with rich-text formatting (Bold, Italics etc)
  4. Hit the email submit button you would be able to see the exData content as the child element of your Textfield.

Now let’s look at above mentioned two scenarios in details:

Scenario 1: User types the rich text into a field and we want to copy that to another field.

How to copy rich text from one Textfield to another Text field?

Steps:

  • Get the content out of first text field by this java script
txtInputTextArea.value.exData.saveXML();
  • Set that value in the destination Textfield’s exData property.
txtOutput1.value.exData.loadXML(userEnteredRichText,1,1);

Scenario 2: We need to pre-populate the form and the rich text data is not typed in (received from web service call or out of database etc..)

How to set rich text data into a Textfield?

Steps:

  • Receive the markup data. eg. Hi <b>John</b>,<br/>Please find application-<i>111</i> details below.
  • Have exData ‘envelope’ ready in your form and inject the received markup data. (You may have to replace &lt; &gt; values with < , > if received data is having that)
  • set the ‘envelope’ + data into Textfield’s exData element.
txtOutput1.value.exData.loadXML(cleanedValue,1,1);

Note:

What is ‘envelope’ which is mentioned in this example/blog entry?

I mentioned ‘envelope’ in Scenario 2 explanation which is something that allows me to insert markup data in a form that Textfield is expecting for rich text support.

What I have done in my sample (attached/linked below) is to have another Textfield storing this exData section with namespaces in it. This is what gets generated behind the scenes when user types the rich text content in Textfield.

I have a ‘ccc’ string in this whole block where the actual data(markup data) is needed for the Textfield to show that correctly.

So in my form script I use this ‘envelop’ to store the exData block and then via script I replace the ‘ccc’ value with the markup data that I receive. And then I use this merged xml block to set to the Textfield’s exData property.

Download Sample implementation:

Use this PDF file that has both of these scenarios implemented as a sample.

Richtext in Textfield Sample

Filed under: LiveCycle Designer,LiveCycle ES

Tags: , ,

12 Comments Add your own

  • 1. Amal Elaine  |  May 23rd, 2009 at 9:35 pm

    This is a really great post too. I can’t wait to see what you put together for the prepopulation we’ve been discussing in the livecycle google group!

  • 2. Bob  |  June 9th, 2009 at 5:50 am

    Do you know of a way to modify a standard text object — as opposed to a multi-line text field — to automatically break to subsequent pages if their is an overflow of content?

    I’m trying to create a contract with embedded fields, and it seems the easiest way is to use the text object as the primary body container. Of course my problem is that the text object doesn’t break despite its being contained within a flowing page and subform.

    Thanks.

  • 3. pandyaparth  |  June 9th, 2009 at 6:58 am

    Hi Bob,
    Did you try multi-line text field for display purpose? I’m thinking of trying out text-field that looks like text object to achieve what you need. You should change the appearance of that text field to look like a text object (with some background fill and removal of borders). Also make the text field to read only.
    Before you assign the text to this text field you should get the contract content with embedded field values. This will allow the lengthy contract details to break at proper location.
    regards,
    Parth

  • 4. Bob  |  June 10th, 2009 at 3:56 am

    Parth,

    Thanks for your quick reply. Last night I was so frustrated that I went to Adobe can came across LiveCycle Designer ES (I have been using 8.0), installed the trial product, and there were the check boxes I’d been looking for: “Allow Page Breaks Within Content” and “Keep with Next”

    The page break worked great when I added the text object to a new form. The PDF preview was great. So I saved the form as a dynamic PDF and everything is back to the way it was before—the text once again runs down page and gets lost below the footer and doesn’t break to the next page.

    Any ideas? I can’t be the only one with this problem, right?

  • 5. Bob  |  June 10th, 2009 at 4:36 am

    OK, the solution to my last post was installing Adobe Reader 9.0. Of course the problem remains that earlier versions will not render the document properly. So in that sense the problem lingers.

    My latest quest will involve disabling the restriction on saving the form data in Reader 9.0.

    It’s always something…

  • 6. pandyaparth  |  June 10th, 2009 at 5:09 am

    Hi Bob,
    I think I’ve got a sample that you would like!! I implemented the Text field usage that I talked in my reply earlier and that works on reader 8 too!
    It may be helpful to you in achieving same results across multiple reader versions.
    The sample is at http://livecyclekarma.wordpress.com/files/2009/06/floatingtext-with-pagebreak.pdf

  • 7. Srini Dhulipalla  |  October 23rd, 2009 at 3:13 am

    Parth,
    This is a nice and useful post. I have been thinking different options but your solution makes the simplest solution.

    Thanks for posting..
    Regards
    Srini

  • 8. E. Loralon  |  November 26th, 2009 at 4:06 am

    Thank you Parth,

    Yes, actually when I discovered the Ctrl+E I thought my problem was solved but the users want more features.

    So I proposed to do the following: add a word template to my form and create a button on the form to open the word document so that the users work from one form/location.

    II am currently able to achieve the above but the question is now to have another button on the form to print both the form and the attachment.

    So I was wondering whether you might be able to help me using JavaScript to create a button that will print the form and the attached document at the same time.

    Thank you in advance for your help.

    Loralon

  • 9. Neha  |  September 28th, 2010 at 1:40 am

    Hi Parth,

    Can u please explain how u achieved this break in a text field.
    I am stuck and have a similar requirement.

    Neha

  • 10. Parth Pandya  |  September 28th, 2010 at 8:51 am

    Hi Neha,
    Can you please explain what you mean by ‘break’?
    cheers,
    Parth

  • 11. Vinay  |  November 11th, 2010 at 7:06 am

    Hi Parth,

    I am developing a print form in SAP. I have a text box with material text. this text box might break depending on the data.
    The problem I am facing is the field breaks as required but the data in the part of field on the next page starts printing from the starting of the text. Thus the data is not printed correctly and completely.
    Can this problem be SAP related??
    Please help…I am stuck..

    Vinay

  • 12. Parth Pandya  |  November 11th, 2010 at 10:04 pm

    Hi Vinay,
    Are you developing this form in LiveCycle Designer? If yes, I’ve seen this functionality working fine. Ideally you want that text field read-only if the data comes form a back-end system. Also allowing height setting to ‘fit to text’ should be enabled on the text field (text area – text field with multiple lines allowed).
    If this doesn’t work then send me the form and i’ll have a look at it for you.
    cheers,
    Parth

Leave a Comment

(required)

(required), (hidden)

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

TrackBack URL  |  RSS feed for comments on this post.


Categories

Recent Tweets

    Recent Posts

    Blogroll

    Tags

    The fine print!!

    The views on this blog are my own and don’t necessarily represent my employer's views, strategies or opinions.